[css-d] gaps in design
Hi! On this page: http://www.missoulagbi.com/index.html, in IE7, do you know why I have a little white gap immediately below the banner image, and also a gap at the bottom of the design that shows the green background? Please see all of the other pages, such as http://www.missoulagbi.com/greenbuilding/projects.html, where there is no white gap below the banner and no bleed through of the green background at the bottom, as it should be. Thanks very much. -Rebecca __ 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] disappearing arrow
Hi! An arrow that should appear to the left of the text Board is missing in IE on this page: http://www.blackfootchallenge.org/rebeccatest/nav1.html It looks as it should in Firefox. What is going on? Thank you :) - Becca __ 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] problems with rollovers on dropdowns
My navigation with dropdowns is giving me some issues: In FF, looks generally o.k., but hovering on the dropdown list items adds in some undesireable margins and padding, though I can't find where those are in the CSS. IE 7 shows many more problems. Too much padding above smallnav, dropdowns on nav appear too high, and rollovers are not clean, margin of the first navigation item should be against left edge. Help! -Becca __ 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] problems with rollovers on dropdowns
Sorry, here's the link: http://www.blackfootchallenge.org/rebeccatest/homepage1_test.html My navigation with dropdowns is giving me some issues: In FF, looks generally o.k., but hovering on the dropdown list items adds in some undesireable margins and padding, though I can't find where those are in the CSS. IE 7 shows many more problems. Too much padding above smallnav, dropdowns on nav appear too high, and rollovers are not clean, margin of the first navigation item should be against left edge. Help! -Becca __ 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] mysterious jump in IE7
Thank you! That worked great. -Becca -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Gunlaug Sørtun Sent: Sunday, May 04, 2008 2:55 AM To: Rebecca Richter Cc: css-d@lists.css-discuss.org Subject: Re: [css-d] mysterious jump in IE7 Rebecca Richter wrote: Does anyone know why, in IE 7, the content in the page jumps down 5 - 10 pixels when you mouse over one of the menu items on the left on this page? IE/win miscalculates how tall leftcol is on first run - gets confused by the 'padding-bottom: 10px;' on leftcol and navbar and therefore places the flash too high before subtracting margin-top on it. IE corrects its calculations when forced to re-render - which takes place on menu :hover. www.greenvalleydesigns.com I would like to make it stop doing that! Restyling to... #flash { margin-top: -275px; clear: both; } ...for IE/win, should do the trick. regards Georg -- http://www.gunlaug.no __ 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] mysterious jump in IE7
Does anyone know why, in IE 7, the content in the page jumps down 5 - 10 pixels when you mouse over one of the menu items on the left on this page? www.greenvalleydesigns.com I would like to make it stop doing that! Thanks :) Becca __ 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] expand column background to bottom
Hi! How can I get the green background of the right column to extend to the bottom border of the design on this page: http://www.missoulagbi.com/directory/sponsors.html? I'd like to do this WITHOUT using the negative bottom margin and padding technique--that gets a little funky in older versions of IE. Becca __ 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] 100% height again
Hi! I received a great tip from here a little while ago on how to make a colum expand to 100% height. I'm now applying this to another design, but I'd like about 10px padding on the bottom, no matter how high the column is expanded. Please see http://www.blackfootchallenge.org/am/publish/newsite/index.php.threecol and look at the Support center column. This is the css where I added the rules to expand the column to the bottom: .col1 { width: 34%; left: 108%; margin: 0 0 -2000px 0; padding: .5em 0 2000px 0; background-position: center top; background-repeat: repeat-x; border: 1px solid #963; background-image: url(../images/backgrounds/support_bg.jpg); } How do I add in the 10px bottom padding? Thanks :) Becca __ 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] navbar breaks in netscape
I thought I had this design looking o.k. in IE and FF, but the navigation bar displays strangely in Netscape: http://www.blackfootchallenge.org/am/publish/newsite/index.php When you roll over a link in the navigation bar, the whole page shifts upward. Also, the spacer between the two different styles of navigation appears narrower than it should. The dropdown menus have some padding in between each link, through which you can see the design behind them. Help! Can I create a Netscape-specific style sheet? If so, how can I do that? Thanks, Becca __ 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] (no subject)
Is there a way I can make my navbar ul element expand vertically to 100% height on the page http://www.choicesmissoula.com/resources/index.html so that the orange background will take up that whole vertical space? The only way I've been able to achieve this on other pages is to make a whole bunch of non-breaking spaces. Thanks in advance :) Becca __ 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] expand element to 100% height
Sorry, I sent this before with no subject Is there a way I can make my navbar ul element expand vertically to 100% height on the page http://www.choicesmissoula.com/resources/index.html so that the orange background will take up that whole vertical space? The only way I've been able to achieve this on other pages is to make a whole bunch of non-breaking spaces. Thanks in advance :) Becca __ 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] navbar questions
Hi! I'm trying out the Sons of Ursidae menus (http://css-class.com/articles/ursidae/). This method is working o.k., but I have 3 problems with it: My design breaks when font size is increased Navigation tabs are not centered on the page (how can I do this?) Not enough of a margin below navigation bar (I've tried adding margin and padding to the bottom of the bar, but this had no effect) Thanks :) Becca __ 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] dropdowns appearing behind content
Hi, I'm wondering why my css dropdown menus are appearing behind the white content area at http://www.blackfootchallenge.org/3col.html. Anyone know? Thanks! Most Sincerely, Rebecca Richter, Owner Green Valley Designs (406)546-9658 [EMAIL PROTECTED] www.greenvalleydesigns.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/
Re: [css-d] dropdowns appearing behind content
Hi Parag, That worked great in FF! Not in IE, though. Any more ideas for that? Most Sincerely, Rebecca Richter, Owner Green Valley Designs (406)546-9658 [EMAIL PROTECTED] www.greenvalleydesigns.com -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Parag Jagdale Sent: Wednesday, February 27, 2008 5:11 PM Cc: css-d@lists.css-discuss.org Subject: Re: [css-d] dropdowns appearing behind content Hi Rebecca, Try adding a z-index:1000; to: .topnav:hover div.dropdown so your ending code should look like this: .topnav:hover div.dropdown { left: -1px; z-index:1000; } it worked for me in FF. Didnt test in IE. Try it. I'm wondering why my css dropdown menus are appearing behind the white content area at http://www.blackfootchallenge.org/3col.html. Anyone know? Thank You, Parag Jagdale Un-identified LLC www.un-identified.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-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] dropdowns appearing behind content - fixed
Thank you, that worked! Most Sincerely, Rebecca Richter, Owner Green Valley Designs (406)546-9658 [EMAIL PROTECTED] www.greenvalleydesigns.com -Original Message- From: Gunlaug Sørtun [mailto:[EMAIL PROTECTED] Sent: Wednesday, February 27, 2008 7:39 PM To: Rebecca Richter Cc: css-d@lists.css-discuss.org Subject: Re: [css-d] dropdowns appearing behind content Rebecca Richter wrote: I'm wondering why my css dropdown menus are appearing behind the white content area at http://www.blackfootchallenge.org/3col.html. Anyone know? It is normal that the last element gets stacked visually in front when elements occupy the same area and no stacking-control is introduced. Add... .nav { position: relative; z-index: 1; } ...to stack the entire navigation in front of other elements. Works in all browsers - including IE/win. Note that IE/win simply cannot properly stack absolute positioned elements relative to non-absolute positioned elements or elements with another parent, so not even a trillion in z-index on the absolute positioned drop-down itself will make any impression on IE/win. regards Georg -- http://www.gunlaug.no __ 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] Dropdowns not appearing in IE
Not sure what I did now, but my dropdowns from Who We Are and Participate are not appearing at all in IE at http://www.blackfootchallenge.org/3col.html. Becca __ 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] extra padding in Safari
Hi! Anyone have a clue why I have a little extra margin or padding on either side of the content table on this page: http://www.montola.com/buy/index.html? Only happens in Safari, that I know of. Thanks! Becca __ 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 5, 6, dropdown display issue
Hi Holly, Still having trouble with the dropdown display in IE 5. IE 6 it looks just fine! My ie.css file has the following rules: .nav { margin-top: -3px; } .topnav { margin-top: 0px; } .nav a { height: 1%; vertical-align: bottom; } .dropdown li { margin-left: -16px; margin-left: 0; } Any more ideas? Thanks :) Becca - Original Message - From: Holly Bergevin [EMAIL PROTECTED] To: Rebecca Richter [EMAIL PROTECTED]; css-d@lists.css-discuss.org Sent: Saturday, January 12, 2008 10:38 AM Subject: Re: [css-d] IE 5, 6, dropdown display issue From: Rebecca Richter [EMAIL PROTECTED] That took care of the extra padding issue in IE 6, but not 5. Anything I can do to correct that? http://www.makemyhousegreen.com/index1.html Hi Becca, Ammend your ie.css file to include the following - .nav a { height: 1%; vertical-align: bottom; } .dropdown li { margin-left: -16px; ma\rgin-left: 0; } And you should find happiness with the IEs ~holly __ 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/
Re: [css-d] IE 5, 6, dropdown display issue solved
Hi Holly, Thanks! Thought that was a typo, but I should have known it was a super-genius Holly hack! Becca - Original Message - From: Holly Bergevin [EMAIL PROTECTED] To: css-d@lists.css-discuss.org; Rebecca Richter [EMAIL PROTECTED] Sent: Sunday, January 13, 2008 4:45 PM Subject: Re: [css-d] IE 5, 6, dropdown display issue From: Rebecca Richter [EMAIL PROTECTED] Still having trouble with the dropdown display in IE 5. IE 6 it looks just fine! My ie.css file has the following rules: .nav { margin-top: -3px; } .topnav { margin-top: 0px; } .nav a { height: 1%; vertical-align: bottom; } .dropdown li { margin-left: -16px; margin-left: 0; } Any more ideas? Thanks :) No more ideas, just the same one. You missed a backslash (escape) character in your .dropdown li selector. See below from my previous suggestion - .dropdown li { margin-left: -16px; ma\rgin-left: 0; /* this line needs the escape character before the letter 'r' */ } ~holly __ 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 5, 6, dropdown display issue
Hi David :) That took care of the extra padding issue in IE 6, but not 5. Anything I can do to correct that? Thanks! Becca - Original Message - From: David Laakso [EMAIL PROTECTED] To: Rebecca Richter [EMAIL PROTECTED] Cc: css-d@lists.css-discuss.org Sent: Wednesday, January 09, 2008 8:33 PM Subject: Re: [css-d] IE 5, 6, dropdown display issue Rebecca Richter wrote: I've got these dropdown menus working pretty slick at http://www.makemyhousegreen.com/index1.html (roll over projects, services, or publications); however, in IE 5 and 6, there is much more top and bottom padding than there should be. What do do about this? Becca Add this declaration to styles for ie: .nav a { height: 1%; } Best, ~dL -- http://chelseacreekstudio.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] IE 5, 6, dropdown display issue
Hi! I've got these dropdown menus working pretty slick at http://www.makemyhousegreen.com/index1.html (roll over projects, services, or publications); however, in IE 5 and 6, there is much more top and bottom padding than there should be. What do do about this? Also, I haven't been able to figure out how to change the color of the topnav or parent class on rollover. I tried .parent li:hover {background: #c90;}, and that hasn't done a thing. Thanks :) Becca __ 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] create expandable banner
Hi Holly :) Ahhaa! So, the placed image goes from left side to the main part of the screen, and the bg image only repeats to the right? How do you know how wide to make your main image so that the design centers on the page? Since monitors vary in resolution, I've never made my design wider than about 770 px. Becca - Original Message - From: Holly Bergevin [EMAIL PROTECTED] To: css-d@lists.css-discuss.org; Rebecca Richter [EMAIL PROTECTED] Sent: Tuesday, January 01, 2008 1:15 AM Subject: Re: [css-d] create expandable banner From: Rebecca Richter [EMAIL PROTECTED] but how do you do it if the banner has a non-uniform background, like on this site: http://www.myersonassociates.com/ Hi Becca, ;) This construction is two part (for the right, expanding side of the header), with a main image placed in the HTML and a background image set to repeat that gives the illusion of a wider image than is actually there when the page expands. I hope that helps, ~holly __ 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/
Re: [css-d] create expandable banner
Hi David, Here's my site so far, with expandable banner and footer images. I still don't know what this looks like on different-sized monitors. I made the bg image in Photoshop with a width of 2000 px. Is this how it works? Thanks :) Becca __ 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] create expandable banner
Hi and Happy New Year :) I am familiar with creating a background image and repeating it with css to make a banner, but how do you do it if the banner has a non-uniform background, like on this site: http://www.myersonassociates.com/? Do I just make an image with wide dimensions, like 5000 px wide, and use positioning to give it the expandable appearance? Or do I need 2 images--one to repeat left and one to repeat right? Thanks! Becca __ 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] IE6 background image positioning issue
Hi, The site I'm working on currently is www.montola.com. My problem is with my css hover and active states on the navigation menu in IE 6. Please check IE 7 or FireFox to see how it should work. On mouseover, a yellow flower (background image) should appear to the left of the list items, looking similar to the selected list item. However, in IE 6, the flower covers up the first letter of the words. I've tried different positioning, to no avail. Help!!! Thanks in advance, Becca __ 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 5, 6 display issues
Hi! I'm new to the list. Thanks for the great resource :) The site I'm working on currently is www.montola.com. Both in IE 5 and 6, my pages load terribly slow, but I don't know if that's my computer, the browsers, or the way I designed the pages. Loads quickly in IE 7 and Firefox. Problems that remain are in IE 6: hovering the list items in the navigation menu on the left is supposed to produce a small yellow flower to the left of the text (as you can see in IE 7 or Firefox). In IE 6 and lower, the flower appears over, or behind the first letters of the text. How to get it to where it is supposed to be? In IE 5, the whitearea div appears way below where it should be--should be just 15px or so down from the banner. Had this problem in IE 6 until I gave it a negative top margin of 490px. Don't know why this didn't have the same effect in IE 5. Do you see any other bugs in my design? Thanks in advance :) Rebecca __ 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/