[css-d] Hover bounces in drop down nav based on a href address ( wordpress)
Here is a strange scenario in the top bar drop down navigation: http://www.sldinfo.com/ My first level of drop down navigation needs to have a 3px underline on hover, and so i've 'faked it out' by using a 3 px white bottom border in teh off state. So far so good. (line 41, navigation.css) What is really odd is that if you hover over Issues and Trends, you get the bounce effect. I was having this trouble with another item - by doing step by step troubleshooting, I found the fix: by literally changing the address of the link, it fixed the problem. Hunh? Saving this out to a static file, and changing the link from a href=http://www.sldinfo.com/?page_id=19; title=Issues amp; TrendsIssues amp; Trends/a to li class=page_item page-item-19a href=http://www.sldinfo.com/?page_id=xxx19; title=Issues amp; TrendsIssues amp; Trends/a removes the effect. The problem: I fixed one element of the nav by simply duplicating the page and (about was bouncing), and then issue and trends started doing it. Any ideas why this would be? I am using the multi-level navigation menu plugin, heavily customized (based on suckerfish). Other problem I've been completely unable to solve is the bounce effect on the sub-sub menus (e.g. Resources - Photo Galleries -- see flyout menu). I've gone through each piece of the code and tried to remedy this 7px bounce, but nothing. Would appreciate any insights on the first problem, and any resources to better understand the structure of the second problem (as I suspect I am not fully understanding the mechanism for the sub-sub-sub menu). Anne Shroeder Web Developer Language Works, web sites in YOUR language http://www.language-works.com Email: a...@language-works.com (301) 755-8400 (cell) Attitude is more important than the past, than education, than money, than circumstances, than what people do or say. It is more important than appearance, giftedness, or skill. ~ W.C. Fields __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] li padding not behaving in Arabic (RTL) format
I'm using an unordered list to display the footer information for this page: http://preview.sonjara.com/omep/new/template_rtl.htm (see http://preview.sonjara.com/omep/new/template.htm for the English, whose padding works fine). The links with the trouble are the text links at the bottom, just above the little icons. If I put padding in or even simple nbsp; in between each item, strange things happen. (1) Padding causes the entire list to be shoved over and suddenly each LI item thinks its part of one big li item and so there is effectively only one link (?!) (2) nbsp; also causes a confusion with what is an individual link. I wonder why? You can see that as it is, the words are butting up right against the pipes and it looks bad. I'm considering just dispalying these are links in a line but hate to give up the battle with the ul/li in Arabic. Other strange thing - the UL at the top of the page (main menu) works fine. Any ideas? Anne Anne Shroeder Web Developer Language Works, specializing in multi-lingual web site development http://www.language-works.com Email: a...@language-works.com (301) 349-0802 (farm/office) (301) 755-8400 (cell) Attitude is more important than the past, than education, than money, than circumstances, than what people do or say. It is more important than appearance, giftedness, or skill. ~ W.C. Fields __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Preventing images/text from wrapping when window is narrowed
A client handed over to me a site that had just awful code (the original http://www.inspiredcre8tions.com/red/) and I cleaned it up, made it more semantic and validated it http://www.language-works.com/RED/indexNEW.htm but she is griping because now the images and the footer wrap under if you narrow the browser window. I'm not sure I understand the rationale for wanting this, since it causes a horizontal scroll, but anyhow, the client wants it. I've searched around but am not finding yet any good answers. A difference between the original version and this one is that she wanted absolute positioning for the top banner (and the code placed at the bottom of the page for SEO). Any pointers much appreciated. Anne __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Rounded corners repeating in IE6
Thanks so much -- unfortunately the 45 validation errors come from the code that the client gave me to implement (their RSS feed), so nothing I can do about that :( I was thinking that probably the issues in IE6 are due to the peekaboo bug (I think that's what it's called) because there are so many nested divs and IE6 is basically freaking out and repeating stuff. It gets even better - they want the 2 cols on the right to be in iframes, so I've implemented that http://www.language-works.com/SmartSign/template_frames3.htm but of course with IE6 it wants a narrower frame, so it needs conditional comment ... but I don't even know what platform they're developing on so have just put in a double bit of code for now with the IE6 comment so they can know what width to implement. What worries me is that this code will be taken by some programmers and messed with even further, and it seems to me that it's fragile, at best. They've said as long as it displays on 1024 they're ok with it (though of course it breaks horribly on anything less). IMO the design is meant for print and not the web, but they don't wnat to hear that Anne - Original Message - From: Alan Gresley a...@css-class.com To: Anne E. Shroeder a...@language-works.com Cc: css-d@lists.css-discuss.org Sent: Friday, April 24, 2009 11:33 AM Subject: Re: [css-d] Rounded corners repeating in IE6 Anne E. Shroeder wrote: I'm using the technique described here: http://webdevtips.co.uk/webdevtips/style/border.shtml to accomplish rounded borders on this somewhat complex design - the client is insistent on fixed heights, so it's been quite a trick. The problem now is that the top right corner seems to be repeating itself and the bottom left and right corners are not showing up at all in IE6: http://www.language-works.com/SmartSign/template_frames2.htm [...] Anne Hello Anne. This page has many problems in IE6, one is that div#column3 has completely dropped below the main content. There are also problems in IE7. The initial problem area is in or surrounding the form in the 1st columns. #column1 #login { background-color:#FEFEFE; width: 191px; margin: 0 7px 19px 8px; padding:0; } #column1 form { margin:-6px 8px 22px 8px; } Changing a width and a margin seems to bring IE6 under some control. BTW, this is a hack fixed since I do not know what is quite happening. You have stirred that cauldron of bugs that is IE6. :-) * html #column1 #login { /* target IE6 */ width: 178px; } * html #column1 form { /* target IE6 */ margin-right:-4px; } Next changing overflow:auto to overflow:hidden remove the scrollbar in IE6. #column2 #newsBlurbs { height:352px; padding: 5px 10px 5px 2px; overflow:hidden; /* change for IE6 */ } Next changing the margin-right on div#column3 (partially removing the float) brings div#column3 up in the correct place. * html #column3 { margin-right:-29px; } This does not solve the problems that you state. Here is a little demo with the hacks for IE6. http://css-class.com/x/eO.htm Something is causing some overflow of the background for div#column3. Maybe correcting those 45 validation errors in the XHTML may help here. Also, at this moment IE6 and IE7 are not handling those negative margins on the list #column3 ul li { margin-left:-28px; margin-top:-10px; } and this causes div#column3 to have greater height which effects the positioning of the rounded corners at the bottom of div#column3. I will take a greater look later. -- Alan http://css-class.com/ Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Rounded corners repeating in IE6
I'm using the technique described here: http://webdevtips.co.uk/webdevtips/style/border.shtml to accomplish rounded borders on this somewhat complex design - the client is insistent on fixed heights, so it's been quite a trick. The problem now is that the top right corner seems to be repeating itself and the bottom left and right corners are not showing up at all in IE6: http://www.language-works.com/SmartSign/template_frames2.htm The basic code: div id=column3img src=login.eo_files/images/benefits_title2.gif alt=Benefits width=143 height=30 style=position:relative; top:25px;left:0;/ div class=tOrangediv class=bOrangediv class=lOrangediv class=rOrangediv class=blOrangediv class=brOrangediv class=tlOrangediv class=trOrangediv class=insideContent Stuff here /div/div/div/div/div/div/div/div /div!-- end column3 -- tOrange is being repeated, whereas blOrange and brOrange are not showing up at all. Thoughts? Anne __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Sticky footer - double decker possible?
My client has a design comp that I'm finding extraordinarily challenging to implement -- the currentt challenge is implementing a sticky footer that has two parts AND that maintains a right/left border on the center column (right and left column contain no content) that extends all the way down to the footer. Using the methodology described here: http://brassblogs.com/blog/sticky-footer I've been able to implement the basic grey line along with the left/right shadows and get the footer to stick to the bottom - BUT not the left/right borders to extend down. Worse, when I add the image of the water on top of the grey line, I find I can only put in a min-height to get it to work - which really means it isn't working. When I add in the orange crossbar, everything breaks apart. Yikes. Is it possible to code this? The comp is here: http://www.language-works.com/swim/comp.jpg My rather unsatisfactory implementation here: http://www.language-works.com/swim/stickyfooter.htm Anne __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Rounded corners with fixed height problem
I've got a bit of a challenge with rounded corners - have a fixed height (it's all going into an iframe) and cannot seem to get the borders out to the edge and the rounded corners placed - an additional problem is that the comp calls for only half of a top border and a small dotted border above that - I'm just not sure that can be done? The graphics for the rounded corners aren't very good - they are just place holders. The problem is in the right hand column that starts with Benefits. The method I used: http://www.webcredible.co.uk/user-friendly-resources/css/css-round-corners-borders.shtml My code: http://www.language-works.com/SmartSign/template.htm The comp: http://www.language-works.com/SmartSign/homepage.jpg I'd greatly appreciate any insights as I've been hitting my head against the wall for some time now. Anne __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Suckerfish in Wordpress - 'current page' in sub menu inheriting primary page's colors
I've put a bit of a hack in my CSS to achieve a current state on my top horizontal navigation -- I'm using the Multilevel navigation plugin in wordpress, which uses a version of suckerfish. The issue is that while the current state is working fine for the top level, it is cascading down to the sub levels as well. Please see http://www.indivumed.com/wp.indivumed.com/?page_id=69 for an example -- hovering over Products and Services, the sub menu item Full pathology service is highlighted in the same dark blue - but if should be highlighted with a light blue. My code: #suckerfishnav li.current_page_item, #suckerfishnav li.current_page_parent, #suckerfishnav li.current_page_ancestor { background:#4c90cc ; } // dark blue background #suckerfishnav ul li ul li.current_page_item, #suckerfishnav ul li ul li.current_page_parent, #suckerfishnav ul li ul li.current_page_ancestor { background:#e4e7f3; } // light blue background What am I missing? Anne __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Project 7 tab menu - individualized bars
I'm working on two knotty problems with a drop down menu system using P7's tab menu magic. http://www.language-works.com/ANSIRH/template_about2.htm The first is that when you hover over one of the top nav items (e.g. About, research other work, etc.) you get a drop down menu -- I'd like to have a top border on that but only up to the vertical grey border - so that it looks like an L and not a box sitting under a nav item. I was thinking to do a negative margin and set a z-index to hide the bottom layer, but my experiments have yielded no success. The second issue is that I want to have a 31px color border at the top of each primary item (About, Research, etc) when you hover over that - but whereas I have split out each of the items for the -- li a-- definitions, I cannot seem to figure out where to do the hover to make that element-specific. It looks like it's on line 73 /* The Root Level Hover. This also locks the Hover state while the root item's associated sub-menu is visible. DO NOT CHANGE SELECTOR NAMES*/ .p7ie6Fix:active, #p7TBMroot .p7TBMtext .p7TBMon, #p7TBMroot .p7TBMtext li a:focus, #p7TBMroot .p7TBMtext li a:active { } I started working on this in Pop menu magic as an alternative, http://www.language-works.com/ANSIRH/template_about3.htm but I don't like it as well for other reasons. Also, it cuts off the last item (news). Does anyone have any suggestions? Anne __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] narrowing browser window moves div to the bottom
Gunlaug Sørtun [EMAIL PROTECTED] wrote about: http://gorge.org/newdes/ A proper - complete - doctype will get IE7 somewhat up to speed, but the 'min-width' value is too small for it when it starts supporting the W3C box model. IE6 doesn't support 'min-width' anyway, but it'll switch box model. Georg, what do you mean by it'll switch box model? Are you saying it's possible to fool IE6 into not using its default box model standards? Anne __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Correcting CSS in complex DB system
I've been asked to assist in correcting CSS problems and adjusting display issues in a fairly complex database system; I had posted about this before, asking about the Yahoo grid CSS generator. However, upon further discussion with the developers I found that they are also using the Zend framework and Jquery to generate a lot of their code. The result is some pretty unsemantic markup, awful awful classitis (whcih they insist is needed because of the functions called by jquery), and really long winded CSS files. Initially I thought the best method would be to simply take the comps and redevelop the basic markup and CSS and have the programmers retrofit this to their code. But when I found out about ongoing code generation, I realized this is prob. not a good method. So it seems now I need to go in and do surgery - piece by piece. Does anyone have experience with this, and any advice they can offer. I hate not fixing the markup; it's such a mess. But I believe my hands are tied here. Anne __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Alt. to max-height in IE (also Safari?)
I'm trying to preserve the original shapes of gallery images in dynamically resized thumbnail images, but in IE6 (and also in older versions of Safari ) this code is simply resizing the images to squares, exactly 167x167. This is the code being used, and on this page: http://130.94.73.213/migration_series/cag/gallery.cfm?galprogid=12 Any ideas what I might be doing wrong? BTW an additional complication is that this is all being done with Cold Fusion and the code falls far short of valdiating (I do not have control over all of the code, hélas). Is there anything I can do? style type=text/css #imggallery img { max-width:167px; max-height:167px; } /style !--[if lte IE 6] style type=text/css #imggallery img {max-width:167px; width: expression(this.width 167 ? 167: true); max-height:167px; height: expression(this.height 167 ? 167: true); } /style ![endif]-- TIA, Anne __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Netscape/mozilla hacks?
I'm not sure why this is the first time I'm having grief with netscape, but on this page http://www.language-works.com/NSTMF/home.php in XP/PC it is (a) not showing the background image in the main content region, (b) shoving the logo graphic (labelled #hpGraphic) up and under the navbar. Also the top yellow 26px border is not showing no matter how I adjust the placement of this graphic. And yet strangely enough I've gotten this border to work on this page http://www.language-works.com/NSTMF/internal.php. Note: Acc. to browsercam, this same problem is occurring on Mozilla 1.7.12 on Win2000 and Mozilla 1.7.12 on XP. Now I'm really confused - I should think Mozilla and Firefox would yield similar results. This is the CSS code for the hpGraphic: #hpGraphic { height: 79px; width: 1008px; background-color:#2F201B; background-image: url(../images/hpGraphic.gif); background-repeat:no-repeat; background-position:70px; padding: 20px 0 0 0; border-top: 26px solid #E9A713; } TIA, anne __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Too many ids in IE causing a drop?
I've inherited a nightmare CSS project. Nearly 1800 lines of really interesting code. On this page: http://www.language-works.com/PSL/ster.htm I am having a problem with a drop of the left hand side of the page in IE -- if I remove the container stereographs altogether, it works fine in IE http://www.language-works.com/PSL/ster2.htm but no longer in Firefox. I prefer to stay with the first version, but I wonder if there is ANY way to get this to work in IE? Is this a case of too many nested divs? I've tried talking with the folks about re-writing the css but they are nervous because they say it is stable it's also almost completely unmaintainable. If you were in my shoes, what would you say? Anne __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Direction: rtl inverting an image?
This is too strange. In IE5.5, some background images that are contained in a div defined with direction:rtl are being inverted and in some cases even turned inside out. I want to know how CSS can corrupt an actual image file!?! The screen caps showing the correct and incorrect image placements are here: http://www.ddiv.com/clients/voa/final_builds_modified_110107/screencaps.htm The file without the weird images (where code works) is here: http://www.ddiv.com/clients/voa/final_builds_modified_110107/test.html And the file with the .headlineListCalloutSide text called, where the problem occurs, is here: http://www.ddiv.com/clients/voa/final_builds_modified_110107/test_problem.html WHen this piece of CSS code is called, the images break: .headlineListCalloutSide { width: 190px; float: left; margin: 10px 2px 0 0; padding: 0 0px 0 0; direction:rtl; } It makes no sense!?! Am I not seeing a typo somewhere? Anne __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Direction: rtl inverting an image?
Right, well I've just figured out the fix - just don't know WHY it made the graphics behave that way. By removing margin: 10px 2px 0 0; from the code I mention below, the graphics right themselves. Anyone encountered this strange behavior before, and is there a rational explanation for it? Anne - Original Message - From: Anne E. Shroeder [EMAIL PROTECTED] To: css-d@lists.css-discuss.org Sent: Thursday, December 20, 2007 7:29 PM Subject: [css-d] Direction: rtl inverting an image? This is too strange. In IE5.5, some background images that are contained in a div defined with direction:rtl are being inverted and in some cases even turned inside out. I want to know how CSS can corrupt an actual image file!?! The screen caps showing the correct and incorrect image placements are here: http://www.ddiv.com/clients/voa/final_builds_modified_110107/screencaps.htm The file without the weird images (where code works) is here: http://www.ddiv.com/clients/voa/final_builds_modified_110107/test.html And the file with the .headlineListCalloutSide text called, where the problem occurs, is here: http://www.ddiv.com/clients/voa/final_builds_modified_110107/test_problem.html WHen this piece of CSS code is called, the images break: .headlineListCalloutSide { width: 190px; float: left; margin: 10px 2px 0 0; padding: 0 0px 0 0; direction:rtl; } It makes no sense!?! Am I not seeing a typo somewhere? Anne __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Centering header images in elastic layout and 100% width - scrollbars
I'm re-coding a web site for someone (not redesigning, not my design!) to be in CSS - he wants the page to extend across no matter what size the browser. OK, so I'm having 2 conundrums that I've not been able to find a solution for: In the header, I'd like to absolutely position the inspections by bob title in the center, with the two other elements at left and right, respectively. I thought to use the same technique as elsewhere (e.g. put the image in a p tag and use margin: 0 auto; ) but this would mean superimposing this over the entire header and this throws the other two images off. I also tried putting the inspections by bob as a background image, centered inside the main header tag but it still migrates to the left. I've kludged it for now using margins but (a) it's going to look bad in many browsers, (b) the entire thing breaks when the wndow is resized - any way to keep the images set in a line even if the browser window goes smaller? I question 2! Why, if I define my body margins 0 and the page width to 100%, do I have a horizontal scrollbar!?! Anne URL: http://www.language-works.com/InspectionsByBob/template.htm CSS: http://www.language-works.com/InspectionsByBob/css/main.css Code: #header { width: 100%; height: 140px; padding: 2px 10px 0 10px; border-bottom: 2px solid #3D756C; background-color:#FF; clear:both; } #header #logoLeft { width: 234px; float:left; text-align:center; } #header #logoRight { width: 123px; float:right; margin: 0 20px 0 0; } #header #middle { float: left; margin: 0 10% 0 10%; _margin: 0 8% 0 7%; } __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Centering header images in elastic layout and 100% width - scrollbars
Much more sensible, thank you. But a question: Why do I need to have display:inline as well as float:left? #header #logoLeft { width: 234px; float:left; margin: -15px 0 0 10px; display: inline; } #header #logoRight { width: 123px; float:right; margin: -15px 20px 0 0; display: inline; } Anne - Original Message - From: Gunlaug Sørtun [EMAIL PROTECTED] May I suggest a simpler method - as a starting-point... http://www.gunlaug.no/tos/alien/aes-3/test_07_1216.html http://www.gunlaug.no/tos/alien/aes-3/test_07_1216_files/main.css __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Browsercam subscription share?
A colleauge of mine and I subscribe to Browsercam (the capture version) and find it absolutely essential in testing CSS-based layout. Is anyone interested in sharing this subscription with us? They can accept up to 10 concurrent users so we have room for 8 people. Thank you! Anne Shroeder Language Works __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] variables in CSS - changing background image by page
I need to be able to change the background-image value for one of my divs by page. In other words, every page needs a different background-image for the #util_header id. Each page currently has an id specified in the body tag, so ideally I could name the images in concert with the body id and thus call the correct image by using a variable whose value would correspond to the body id. But I know that is not possible in CSS. I'm wondering what the most efficient way would be to call up the proper image for each page without building separate classes (or ids) for every single page? Here are two graphics to give an example of what I'm working with. http://www.serendipitycreative.com/goetz/test.htm Anne Anne Shroeder Web Developer Language Works, specializing in multi-lingual web site development http://www.language-works.com Email: [EMAIL PROTECTED] (301) 349-0802 (farm/office) (301) 803-9734 (cell) __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] IE - border around image erroneously displaying
http://www.ddiv.com/clients/voa/final_builds/chinese_news.html The problem area is on the right hand side, where the Tabbed navigation items are. The two buttons are orange and grey, side by side. They are appearing irregularly in Win 2000/XP on IE6.0 and IE5.5 with a blue border on either edge (as an image would that is linked without border=0 or border:none used). I'm wondering if it is the class buttonsAlignRight that is causing this misbehavior? I'm also thinking this is not a good way to code this, but I had trouble since these buttons MUST fall along the same line as the tabs. I would greatly appreciate a guidance to correcting this small issue. The HTML code is: div class=buttonsAlignRight a href=# class=noTabimg src=images/chinese_news/orange_button.gif alt= width=30 height=15 border=0 //a a href=# class=noTabimg src=images/chinese_news/grey_button.gif alt= width=30 height=15 border=0 //a /div The CSS is # tabsContainerChinese a.noTab:link, #tabsContainerChinese a.noTab:visited:hover, #tabsContainerChinese a.noTab:hover { text-decoration: none; margin:0; padding:0 2px 0 2px; border:none!important; background:none!important; display:inline; background-color: #333ee6; } .buttonsAlignRight { float:right; } Anne Shroeder [EMAIL PROTECTED] __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] IE pushing text down in block (Chinese)
http://www.language-works.com/CSS_Stuff/chinese_news2.html The problem area is marked in English, red bold text. I am not clear on why in IE the entire set of text gets moved to a separate line below the orange bullet (and not indented!) whereas it works just fine in Firefox? I'm sure it's a special IE bug, but have not found anything to explain the weirdness. The basic code is: div class=headline2Col img src=images/bullet-orange-tiny.gif class=orangeBullet / a href=#吕秀莲苏贞昌涉嫌滥用国务机要费/a /div .headline2Col { width: 186px; _width:185px; margin: 5px 6px 0 0; _margin: 5px 6px 0 0; padding: 0 0 0 0; float: left; } .headline2Col a:link, .headline2Col a:visited { display: block; width: 186px; _width:185px; margin: 0 0 5px 0px; _margin:0 0 0 0; } img.orangeBullet { float: left; margin: 6px 1px 5px 1px; border: none; clear: both; } Would appreciate any pointers, as I've spent many hours fiddling with the spacing on this to no avail! Anne Anne Shroeder Web Developer Language Works, specializing in multi-lingual web site development http://www.language-works.com Email: [EMAIL PROTECTED] (301) 349-0802 (farm/office) (301) 803-9734 (cell) __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE pushing text down in block (Chinese)
You're brilliant! Thank you! I also wanted to use lists, but the project manager said taht we have to be compliant with IE 5.5 and she said there were issues with that browser. Do you agree? Anne - Original Message - From: Philippe Wittenbergh [EMAIL PROTECTED] To: CSS-D css-d@lists.css-discuss.org Sent: Wednesday, September 19, 2007 2:09 AM Subject: Re: [css-d] IE pushing text down in block (Chinese) On Sep 19, 2007, at 2:41 PM, Anne E. Shroeder wrote: I am not clear on why in IE the entire set of text gets moved to a separate line below the orange bullet (and not indented!) whereas it works just fine in Firefox? I'm sure it's a special IE bug, but have not found anything to explain the weirdness. the links, because you declare a width, 'have 'haslayout' set tot true. As a result, the whole block is moved to the right, but there is not enough space in the parent block, and the link drops below the image. Remove the width should fix the issue Why not use a list ? Philippe --- Philippe Wittenbergh http://emps.l-c-n.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] 3px IE6 gap
Got an IE 6 problem -- it's putting a 3px gap between my two divs - left one is floated, right one is set at a left margin to equal the photo plus border. http://www.language-works.com/CSS_Stuff/specialreport.htm Have tried a variety of things to close the gap but nothing works. Any ideas on the hack I need here? Anne Anne Shroeder Web Developer Language Works, specializing in multi-lingual web site development http://www.language-works.com Email: [EMAIL PROTECTED] (301) 349-0802 (farm/office) (301) 803-9734 (cell) __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] flash overriding P7 nav drop down menu
I'm wondering if my problem is a definition of divs, or the way I've embedded the flash movie (i'm not a flash person, so do not know if I've done this correctly). I've set the z-index of the flash movie (#flash_element) to 1000 and the z-index of the container for the drop down navs (#menuwrapper) to 2, but still the flash movie prevents the drop down menus from showing. Here is the page with teh flash: http://www.language-works.com/ALMA/homepage_flash.htm And here is the page as the navs should be working: http://www.language-works.com/ALMA/homepage5.htm TIA, Anne __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Different stylesheets for IE6
I have two separate stylesheets - one that works fine in IE6, and one that works fine in everything else! The primary page: http://198.104.158.65/homepage4_R.htm and the stylesheet: http://198.104.158.65/css/frontpage4.css The page that works OK in IE6: http://198.104.158.65/homepage_IE4.htm and its stylesheet: http://198.104.158.65/css/frontpage_IE4.css I've tried using the import code in this page: http://198.104.158.65/homepage_IE4_import.htm but it breaks the page in IE horribly. I've also tried the * html hack by including all of the IE-specific defintions in my main stylesheet with * html prefacing them - - again, no luck. I'm not sure what I'm doing wrong? Anne [EMAIL PROTECTED] __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Divs misaligning in IE only
http://www.language-works.com/IRF/about/ CSS: http://www.language-works.com/IRF/css/irfstyles.css I'm sure this is super simple -- the main body text of my page is shoving down below the left nav bar in IE. The left and main part of the content are contained within a div: #mainbody { top: 170px; } and the left nav is defined as : #leftnav { float:left; position: relative; width:200px; font-weight: bold; } the main content defined as: #maincontent { padding-left:12px; border-left: 1px solid #FFCC66; margin-left: 236px; } What am I missing? Anne [EMAIL PROTECTED] __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Box content/hidden content dynamically selected?
I've got a bit of a bear of a project on my hands. The basic premise is that there is a series of (equal sized) boxes, each of which contains text or photos - when you hover over each box you get a different interior color and different words or pictures inside. The major issue is that the people who will be using this want to be able to dynamically select all of the content and appearance of content for each of these boxes. http://www.language-works.com/CSS_Stuff/boxmodel.htm This is my list of challenges: 1.. Create each box in a row with a solid border and an interior that rolls over to another color (done) 2.. Use a variety of fonts and colors for text on the normal state of the boxes - possibly OK: because I'm using the a tag to define the block for the hover, I'm using a span to allow for the different font definitions.But apparently the people who will use this want to be able to go in via wysiwyg and change fonts dynamically so I don't know what possibilities exist for their messing up other code. 3.. Change font when the hover occurs - problem:I'm not sure how to override the span definition for the font? 4.. Here is the real problem: The entire content needs to change when the hover occurs. I presume I need to use a hidden definition plus some javascript to display it-- but the page needs to be dynamic so that users can pick and choose what boxes and what hidden answers they have for each area. I'm just not seeing how this can be done. 5.. Create drop shadow (either through CSS or by using a graphic border -- not worried about that yet) I woke up this morning wondering if this can be done at all - and thinking it woudl be smarter to just use graphics for the whole thing, esp. since the original font choices are non standard and so the whole look for the site will change significantly when using standard fonts Am very interested in thoughts adn/or examples of similarly excecuted sites. Anne __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Complex form - some layout questions
Today I embarked on my first CSS form. And it's a doozy. This is a screenshot of what the form needs to look like: http://www.language-works.com/swimdesign/screenshot.htm And this is what I've managed to code: http://www.language-works.com/swimdesign/basicform.htm Yes, it's a bit of a mess still. Here are some pointed questions: (1) I can't see how to get the radio button to sit in front of the text it belongs to (it keeps shoving the text down to the next line) (2) ditto for the checkboxes (3) How can I control what fields are displayed on what lines - I can adjust the size of the text fields so that they force the next fields down to the second line, but I can't do that with checkboxes. So how can I tell the code to only display a certain number of fields per line? (4) I am really puzzled about how to do the checkboxes that need to be indented (example: Box that starts with the word Industrials) I think that I'm somehow missing some basic instruction on how to manage layout of items in CSS because each new task that presents itself to me gives me a migraine! Any recommendations are welcome. Anne __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Drop down (p7) menu hidden behind other CSS elements?
I've just implemented a different method for using a drop down DHTML menu because I was not satisfied with the behavior of the other one. It is working great on its own: http://www.language-works.com/swimdesign/dropdown.htm CSS located at http://www.language-works.com/swimdesign/p7_cssexpress/p7exp/p7exp.css but it gets hidden behind other elements of the page when integrated. What am I doing wrong? Examples of implementation: http://www.language-works.com/swimdesign/template-public-6.htm CSS at http://www.language-works.com/swimdesign/template-public-6.css and http://www.language-works.com/swimdesign/template-10.htm CSS at http://www.language-works.com/swimdesign/template-10.css TIA, Anne __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Drop down (p7) menu hidden behind other CSS elements?
Thank you so much :) Last night a kind man from P7 emailed me and apparently I had put in some extra definitions in my main ul tag that broke the code. So largely it works. HOWEVER there is the problem in IE where the form (Choose a sector) falls in front of the drop down, whereas it shoudl fall in front. http://www.language-works.com/swimdesign/template-10.htm I read somewhere that one needs to set the form value to invisible but I'm not really sure where and how to do that. DOes anyone have ideas or references of fixes they can send me to? Anne - Original Message - From: Rahul Gonsalves [EMAIL PROTECTED] To: Anne E. Shroeder [EMAIL PROTECTED] Cc: css-d@lists.css-discuss.org Sent: Monday, September 25, 2006 1:07 PM Subject: Re: [css-d] Drop down (p7) menu hidden behind other CSS elements? Anne E. Shroeder wrote: http://www.language-works.com/swimdesign/template-public-6.htm CSS at http://www.language-works.com/swimdesign/template-public-6.css and http://www.language-works.com/swimdesign/template-10.htm CSS at http://www.language-works.com/swimdesign/template-10.css TIA, Anne Hi Anne, Menu works well for me in IE6, and FF 1.5.x. Tell me if you'd like screenshots, can test in IE7 too if you'd like. I have used this menu before, on another site, and have had no problems whatsoever. YMMV. Note that the private page has some problems by the time the text was large enough for my comfort. Regards, - Rahul. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Drop down (p7) menu hidden behind other CSS elements?
Unfortunately my client is pretty set on the design -- literally to the pixel. Do you have a reference for the hiding script? I will suggest to them that this is a real problem, but I am not hopeful to have flexibility in moving this form. http://www.language-works.com/swimdesign/template-10.htm Thanks for all your GREAT help. anne - Original Message - From: Al Sparber [EMAIL PROTECTED] Sorry - you do seem to have fixed the issues we looked at yesterday - though David raises a good point about using pixels for your font-sizes. I see you have a new page that has select lists below the menu. IE5.x -6.x has issues with absolutely positioned elements and select menus. The buggers, as you now know, want to rise above. The good news is that this issue is fixed in IE7. The bad news is that there are no easy fixes for older versions. Most people compromise and move one thing or another out of the way. You could use script to hide the select menu when the CSS sub-menu is showing, but it's really not a good solution. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] 2 spacing questions in IE
This is the URL in question: http://www.language-works.com/swimdesign/template-public-4.htm I've been fiddling with numbers all night and am stymied by the following spacing problems: (1) I'm trying to eliminate the white space between the masthead graphic and the blue drop down menu bar under it. The top nav is 93px high, and I start the blue nav bar at 94 (2) I'm wondering why the leading is not consistent in the quote from the WSJ - the first line squishes the lines together more. I played with a different sized quote mark and different line-height defs, and got the result that the leading between lines 2 and 3 now were inconsistent http://www.language-works.com/swimdesign/template-public-4a.htm weird! Line height is defined at 34px and the quote graphic is 24px high. Any thoughts most appreciated. Anne __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] 2 spacing questions in IE
I'm sorry, I neglected to note that the CSS is located at http://www.language-works.com/swimdesign/template-public-4.css - Original Message - From: Anne E. Shroeder [EMAIL PROTECTED] To: css-d@lists.css-discuss.org Sent: Tuesday, September 19, 2006 2:36 AM Subject: [css-d] 2 spacing questions in IE This is the URL in question: http://www.language-works.com/swimdesign/template-public-4.htm I've been fiddling with numbers all night and am stymied by the following spacing problems: (1) I'm trying to eliminate the white space between the masthead graphic and the blue drop down menu bar under it. The top nav is 93px high, and I start the blue nav bar at 94 (2) I'm wondering why the leading is not consistent in the quote from the WSJ - the first line squishes the lines together more. I played with a different sized quote mark and different line-height defs, and got the result that the leading between lines 2 and 3 now were inconsistent http://www.language-works.com/swimdesign/template-public-4a.htm weird! Line height is defined at 34px and the quote graphic is 24px high. Any thoughts most appreciated. Anne __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Dropdown menu
Hi Maria, Take a look here: http://www.webbedenvironments.com/dhtml/ I used the dropdown menu code http://www.webbedenvironments.com/dhtml/code/18_NavigationControls/MenuDropDown/index.html - it is pretty stable, but I've had a few issues with it because it uses onclick instead of onmouseout. You can see it in action here: http://www.language-works.com/swimdesign/template-8.htm I was able to configure the code to mouseover (instead of requiring a click) to drop down, but I'm still working on how to get the drop down to disappear when I move the mouse off of it (should be easy but) Anne - Original Message - From: Maria Falconer [EMAIL PROTECTED] Hi all Can anyone tell me how (or point me in the right direction) I can make a link like this a href=photography_music.htmlmusic/a Have a dropdown list of options to choose from, each taking the user to a different page. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Disappearing table in IE
http://www.language-works.com/swimdesign/template-6.htm Source code tells me it's there; I can print out text before and after the two div's in the middle of the page (#mainleft and #mainright) but nothing shows up inside those divs! Page and CSS both validate. TIA, Anne __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Table vs. CSS when decorative graphic required?
I'm scratching my head over this one. I've got two different versions, one using a table and one using CSS to layout the bars, but in neither case can I achieve a consistent underline across the screen as required. See http://www.language-works.com/swimdesign/no-tables.htm for the two versions, plus the graphic mockup which I'm trying to imitate! I greatly appreciate any insights. Can this even be done? Anne __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Underlining across varied elements?
I've had some terrific help from people on this list with regard to rounded tabbing effects and I'm very grateful! I'm now at the next stage of trying to get an underline to go across from label, under tabs, and all the way to the right hand side of the container. This is the current version, which uses a table for layout: http://www.language-works.com/swimdesign/template-2.htm I figured that with the table I would have difficulty in getting the line to work unbroken across the cells -- so I did an updated version, which uses CSS for layout: http://www.language-works.com/swimdesign/no-tables.htm (I can't seem to get the drop down to move over to the left!!) -- along with a screen cap of what it's supposed to look like. I've tried implementing a class to handle the whole area .bottomline { border-bottom: 1px solid #163A66; } But no cigar. Part of the trouble is that I'm using a BR to get the second row of tabs down below the first row of tabs. Any ideas at all? Anne __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Navbar disappearing in IE and spacing questions
I'm having a great weirdness in IE - my dark blue navigation bar is simply disappearing. It works fine in Firefox, and I'm really puzzled as to what is causing it to simply not display at all in IE. There are two examples of this phenomenon: http://www.language-works.com/swimdesign/template-public-1.htm http://www.language-works.com/swimdesign/template-1.htm I have two other questions :) (1) On this page: http://www.language-works.com/swimdesign/template-public-1.htm the grey box on the right is not flush with the margin - is it possible to get it over there? I've checked the margin definition and it is 0, so I'm not sure how else to accomplish that. (2) I need a grey line to go over the footer navigation - right now I'm just using an HR tag and specifying a width, but really the grey bar needs to expand or contract along with the text under it. Any ideas how to accomplish that? I apologize if these are naive questions - i'm still struggling through the maze of CSS-dom. Anne __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Simple floating thumbnails with captions
Fascinating -- I'm not seeing what prevents the images from going out horizontally - what makes them wrap to the next line? - Original Message - From: Gunlaug Sørtun [EMAIL PROTECTED] In a fluid layout I think this will work better... http://www.brunildo.org/test/ImgThumbIBL.html ...meow. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Rounded tabs - top line not working?
http://www.language-works.com/swimdesign/tabs.htm I'm trying to get a straight line to appear over the tabs (but not over the rounded part) -- in Mozilla the line is overlapping the graphic, but in IE it's not appearing at all. Any ideas what I'm doing wrong? Anne __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Newbie seeking layout examples to study
I've been working for about 2 days straight trying to get a fairly straightforward alignment set up (left navigation top header that runs the width of the page starting after left nav middle part of page (under header) right side of page (narrow margin) and footer) I've learned a great deal and perused many sites and bought 2 books - but still can't get it right. I would like to know if someone can point me to some sites that have a basic 3 column layout with header and footers where I can study the code? Thank you! Anne __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/