[css-d] Help - images being pushed in IE 7
Hi to all I'm creating a new web site using css I'm using a hybrid - 2 columns with the left fixed (position absolute) and the main one using % ems (position relative) I have 8 pages all working from the same template that I have created using an external style sheet. I'm just working on the index page to set-up the template. Problem: The site looks great on a Mac –– using safari, firefox, explorer #5 The only problem is with explorer with the footer. I have 2 images with a single line of text between the images, all centered The 2 images are about 2 inches below the line of text? On a PC, no problem with any of the other browsers except explorer 7. This time the images are in their proper position in the footer, but the text below which is in a smaller size, isn't lining up to centre, but the images are? The really big concern is the side navigating bar image and the css text is being pushed about 3 inches toward the centre which destroys the whole lay-out on the page. This is only happening on a pc using explorier 7. I'm wondering what explorer bugs am I encountering and what hacks I need to write in. The other problem that I have with all browsers on both mac pc is that the Image behind the navigation bar doesn't repeat as the main body text increases in size. I have it set to repeat on the y axes. I've read that explorer doesn't like padding so I've stayed away from using any at all. I'm still new at this so any ideas would be great. You can view the site at this url http://www.drbjornsauto.com/index_01.html Thanks chris __ 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] Help - images being pushed in IE 7
On Mon, 15 Dec 2008 06:33:59 -0800, u24y...@gmail.com wrote: | http://www.drbjornsauto.com/index_01.html http://validator.w3.org/check?verbose=1uri=http%3A%2F%2Fwww.drbjornsauto.com%2Findex_01.html shows 25 errors. Suggest you fix these first. -- Rasal Postill Dance your Life - Biodanza in Holland - http://www.danceyourlife.eu __ 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] Banner width 1px less than page width
Thank you David. I thought there might be some bug workaround going on so thanks for clearing things up. __ 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] Problem with float?
On this page- http://southerncommunityguide.com/dev/landing-gallery.html the first div class=sidebar (with the St. James logo) should be floated up beside the div class=gallery (big photo) but for some reason I can't get it to get up there. I have floats set but still...it won't go. Can someone spot check me and see what I'm forgetting? Thanks! Marty Martin __ 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] image display issue...something silly, I'm sure
Philippe Wittenbergh wrote: please) nudge in the right direction. In the html code: div id=hcenterimage In the stylesheet: div#hcenterimg Philippe --- Philippe Wittenbergh http://l-c-n.com/ Hi Philippe, I did say I'd gone blind, eh? Thanks so much for the gentle nudge...another set of eyes was definitely needed. Now I'm off to get it in line and contained :) Kindest regards, -Ray __ 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] Help - images being pushed in IE 7
On Mon, 15 Dec 2008 06:33:59 -0800, u24y...@gmail.com wrote: [...] The really big concern is the side navigating bar image and the css text is being pushed about 3 inches toward the centre which destroys the whole lay-out on the page. This is only happening on a pc using explorier 7. I'm wondering what explorer bugs am I encountering and what hacks I need to write in. The other problem that I have with all browsers on both mac pc is that the Image behind the navigation bar doesn't repeat as the main body text increases in size. I have it set to repeat on the y axes. I've read that explorer doesn't like padding so I've stayed away from using any at all. I'm still new at this so any ideas would be great. You can view the site at this url http://www.drbjornsauto.com/index_01.html The bugs you are encountering are in your code, not the browser. There are conflicting rules for #sidebar1, forcing browses to guess. You have a float declaration followed by position: absolute; - but you have no position specified, forcing browsers to guess. Delete the float declaration, and give it the top and left that you want, and browsers will then agree. Declaring base font in EMs triggers the extreme font sizing bug in IE. I suggest you use a base font of 100%, or you may have other problems with text sizes. As has been mentioned, you have errors in both HTML and CSS. I suggest you validate before posting your next query. Cordially, David -- __ 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] Help - images being pushed in IE 7
u24y...@gmail.com wrote: Once you have cleaned up the source-code - as has already been pointed at - you can look for solutions to the more CSS related problems. The only problem is with explorer with the footer. I have 2 images with a single line of text between the images, all centered The 2 images are about 2 inches below the line of text? Delete the 'vertical-align: -25%;' you have on those images. IE/Mac can't handle it as intended - see below. On a PC, no problem with any of the other browsers except explorer 7. This time the images are in their proper position in the footer, but the text below which is in a smaller size, isn't lining up to centre, but the images are? I'm not sure how you want those images to line up with the text, but I suggest you try 'vertical-align: middle;'. Will align text/images the same in all browsers, I think, and even IE/Mac can handle that style. The really big concern is the side navigating bar image and the css text is being pushed about 3 inches toward the centre which destroys the whole lay-out on the page. This is only happening on a pc using explorier 7. I'm wondering what explorer bugs am I encountering and what hacks I need to write in. Somewhat wrong approach. 1: an element can either be absolute positioned or floated - not both, since absolute positioned elements can't float. 2: if you choose absolute positioning for the #sidebar1, then you also have to declare 'left: 0;' on it as IE/win will otherwise not know where to position that element and places it where it falls. I suggest you float #sidebar1, like in my example below. The other problem that I have with all browsers on both mac pc is that the Image behind the navigation bar doesn't repeat as the main body text increases in size. I have it set to repeat on the y axes. The height of #sidebar1 is unaffected by the height of other elements, and background can't go outside its own element. For solutions: google for faux columns, or apply Equal Height Columns... http://www.positioniseverything.net/articles/onetruelayout/equalheight ...as I have in the example below. I've read that explorer doesn't like padding so I've stayed away from using any at all. Only true for IE in quirks mode - related to IE's proprietary box model. IE6 and later versions are in standards mode for your page, and therefore use the W3C box model same as all other browsers. http://www.drbjornsauto.com/index_01.html Example that'll render the same in all browsers: http://www.gunlaug.no/tos/alien/nm/test_08_1215.html ...all major CSS corrections / additions here... http://www.gunlaug.no/tos/alien/nm/test_08_1215_files/index000.css Not intended for copy and paste. I have removed all unnecessary relative and absolute positioning from the CSS, and also all superfluous br / and pnbsp;/p from the source-code in this example. (The source-code is clean apart from that I have butchered some of your UTF-8 coding. It didn't play well with my editor's default settings and I didn't bother to change settings... http://validator.w3.org/check?uri=http%3A%2F%2Fwww.gunlaug.no%2Ftos%2Falien%2Fnm%2Ftest_08_1215.htmlcharset=utf-8doctype=Inliness=1group=0user-agent=W3C_Validator%2F1.606 I have also partially ignored IE/Mac, since that old bugger will need special treatment the way I have styled my example :-) ) regards Georg -- http://www.gunlaug.no __ 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] IE6 Win list-style problem
I have a feature box containing a ul which I want styled with bullets. For some reason, the bullets are not showing up in IE6 Win, they do show up in FF2 Win, FF3 Mac, Safari 3.2 Mac, and Opera 9.5 Mac. Following is an excerpt from my stylesheet. li.farray { width: 100px; float: left; color: #66; margin-right:0px; margin-left:30px; _margin-left:15px; } #features ul.featurearray { width: 280px; overflow:hidden; background-color:#DDD; border:1px #777 solid; padding-top: 10px; padding-bottom: 10px; } #features ul li { list-style:disc; } To increase specificity I have even tried: #wrapper #container #content #maincontent #features ul.featurearray { list_style:disc; } and about every other permutation, none will cause IE6 Win to display a bullet. Can anyone make a suggestion? To state the obvious, I have checked all ul definitions in all stylesheets, specifically any stylesheets and definitions that are loaded *after* this. Going crazy!! __ 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] alignment question
If I have a container div that is 400px high and I place another div inside it that is only 200px high and want the next one to sit at the bottom of its parent container, what css property should I use? I tried vertical-alignment:bottom, and vertica;-alignment:baseline in the parent container, but I can't get that child div to sit at the bottom. Any suggestion appreciated. Angela French Internet Specialist State Board for Community Technical Colleges 360-704-4316 http://www.checkoutacollege.com http://www.sbctc.ctc.edu __ 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] Horizontal nav displays vertically in IE
Hi People, I've noticed that in a few IE browsers [not sure which version/s] my horizontal menu is displaying as a vertical list. In those browsers, the default style type shows ups too. What's a more reliable way of creating the effect I'm after? http://tinyurl.com/64pxaz Help appreciated muchly as always Kimi -- This email sent by Kimi Wei http://thewei.com 201-475-1854 __ 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] mystery gap plaguing me
I have a mystery gap in my website and I can't figure out what's going on. Could someone tell me what the root cause of it is? I've tried everything I know but can't figure out what is giving me grief here is the site http://www.sthig.com/unisource/ here is the css http://www.sthig.com/unisource/style.css best scott -- S c o t t T h i g p e n Illustrative Designer art: http://www.sthig.com design: http://www.thigpendesigns.com Phone: 770.527.3958 __ 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] Horizontal nav displays vertically in IE
Kim Brooks Wei wrote: I've noticed that in a few IE browsers [not sure which version/s] my horizontal menu is displaying as a vertical list. IE7 and older don't support CSS table display-values. You have to feed them some additional 'display: inline-block' trickery. See below. http://tinyurl.com/64pxaz http://www.gunlaug.no/tos/alien/kbw/test_08_1215.html CSS: http://www.gunlaug.no/tos/alien/kbw/test_08_1215_files/bc4hkids.css regards Georg -- http://www.gunlaug.no __ 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] mystery gap plaguing me
Scott Thigpen wrote: I have a mystery gap in my website and I can't figure out what's going on. Could someone tell me what the root cause of it is? I've tried everything I know but can't figure out what is giving me grief http://www.sthig.com/unisource/ best scott Reset this declaration to read only: #side_top { border: 1px solid lime/*4 position only*/; height: 16px; background: url(images/right_top.jpg) top right no-repeat; } -- A thin red line and a salmon-color ampersand forthcoming. http://chelseacreekstudio.com/ __ 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] Horizontal nav displays vertically in IE
Kim Brooks Wei wrote: I've noticed that in a few IE browsers [not sure which version/s] my horizontal menu is displaying as a vertical list. In those browsers, the default style type shows ups too. What's a more reliable way of creating the effect I'm after? See the (horizontal) list tutorials at http://css.maxdesign.com.au/ -- Benjamin Hawkes-Lewis __ 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] drop down menu fixed position?
Hello all, Is it possible to keep a drop down menu displaying once you have arrived at the page? For e.g., from the index page you click a link for the Results page. When you get to that page, can the drop down menu display permanently, cancelling the disappearing rollover effect? It seems to me that this must have to do with the display, but I am not getting it? Thanks for any help or direction to instructions. KittyG http://www.prettygoodwebsites.com/phchelp/results.htm http://www.prettygoodwebsites.com/phchelp/phc_stylin.css BTW, if it's helpful to anyone, the best answer to my last problem turned out to be: Try adding: ul ul {padding: 0;} Can anyone help me with why the drop downs are not centered under the links? They are off to the right. They are supposed to be centered. Whenever I see an adult on a bicycle, I do not despair for the future of the human race. -H.G. Wells __ 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/