[css-d] Css Problem with IE
Hi Guys, I've been struggling with an IE problem. See the following http://www.leadersmith.org.uk/gt/test3.htm its extracted from a site I'm working on. The last member has the name missing (its Member). Its there in the html but is not showing. If I remove the background color I can then see all the names, but I need the background white. Works fine in Opera and FF. Fails in IE 6 and IE 7. Any Ideas. Regards Nic __ 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] Css Problem with IE
Nic Pulford wrote: I've been struggling with an IE problem. See the following http://www.leadersmith.org.uk/gt/test3.htm its extracted from a site I'm working on. The last member has the name missing (its Member). Its there in the html but is not showing. If I remove the background color I can then see all the names, but I need the background white. Works fine in Opera and FF. Fails in IE 6 and IE 7. Any Ideas. Good old peek-a-boo, caused by clearing styles. If you add a nbsp; inside the last div class=clear/div, the problem is gone in IE7. This might just be an unnecessary hack though, see below. Can't test in IE6 really, as in my version it doesn't even show any of the names - my version is JavaScript-cripled, could have something to do with that. Could also be due to errors in the code, as you have 4 divs, each with id=userBox, and also 4 with id=userboxbuttons. You can't have multple IDs with the same name on one page. Best to change those IDs to classes, so they can be reused on the page. -- Els __ 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] Css Problem with IE
Nic Pulford wrote: http://www.leadersmith.org.uk/gt/test3.htm Works fine in Opera and FF. Fails in IE 6 and IE 7. Nic Try: #userBox { zoom:1; } re: on having layout http://www.satzansatz.de/cssd/onhavinglayout.html -- 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] Css Problem with IE
Hi Els, The problem was the nbsp;. And yes all those id's where all wrong. It was a once off originally forgot to change it when I reused them. I use and empty clear all over the place I had better search for that style use. Thanks, Given your prompt replies I should have asked earlier, however it might help embed the learning. Nic -Original Message- From: css-d-boun...@lists.css-discuss.org [mailto:css-d-boun...@lists.css-discuss.org] On Behalf Of Els Sent: 12 March 2009 15:49 To: n...@lasadev.com; css-d@lists.css-discuss.org Subject: Re: [css-d] Css Problem with IE Nic Pulford wrote: I've been struggling with an IE problem. See the following http://www.leadersmith.org.uk/gt/test3.htm its extracted from a site I'm working on. The last member has the name missing (its Member). Its there in the html but is not showing. If I remove the background color I can then see all the names, but I need the background white. Works fine in Opera and FF. Fails in IE 6 and IE 7. Any Ideas. Good old peek-a-boo, caused by clearing styles. If you add a nbsp; inside the last div class=clear/div, the problem is gone in IE7. This might just be an unnecessary hack though, see below. Can't test in IE6 really, as in my version it doesn't even show any of the names - my version is JavaScript-cripled, could have something to do with that. Could also be due to errors in the code, as you have 4 divs, each with id=userBox, and also 4 with id=userboxbuttons. You can't have multple IDs with the same name on one page. Best to change those IDs to classes, so they can be reused on the page. -- Els __ 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-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] CSS problem in IE
Hi, I'm new to the group and have recently started on CSS positioned sites. I have stumbled across a problem with floating an image and wondered if anyone here can help because i haven't had much luck anywhere else. The problem only happens some of the time and ONLY in Internet Explorer. It involves an image loading and occasionally jumping across the page to the left and covering up the navigation. You can see the problem here: http://www.colourgen.com/printers/kodak_1200i_offer.php (keep refreshing the page until it goes wrong) I have been changing the CSS and trying numerous box hacks and other things suggested to try and stop the jumping but haven't been able to fix it. The weird thing is that when you copy the files onto your hard drive then apparently the problem doesn't occur. I'm guessing that it's likely to be do to the left hand column causing a problem somewhere and what i think is happening is that the image is loading first, positioning itself and then the left column loads behind it. If the image is out of place, right click on it and select properties and it jumps back into the correct position - strange!! any help is greatly appreciated thanks in advance Matt __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS problem in IE
Matthew Hackett wrote: I'm new to the group ... Hi Matthew. ... It involves an image loading and occasionally jumping across the page to the left and covering up the navigation ... http://www.colourgen.com/printers/kodak_1200i_offer.php (keep refreshing the page until it goes wrong) div class=content h1.../h1 pimg src=... class=float_img height=152 width=200 Take advantage of one of our two great offers when you ... /p You had to relatively position the floating image to prevent it from disappearing, but now its positioned with no stable origin in IE: its parent P is not positioned nor dimensioned. So the options are at least A: add position:relative to the parent P B: add a dimension to the parent P and remove the position:relative from the IMG C: Take the image out of the P and remove the position:relative. div class=content h1.../h1 img src=... class=float_img height=152 width=200 p Take advantage of one of our two great offers when you ... /p I doubt if option A is a good one. In IE, position:relative is just too buggy, but it depends. As in this case and in several others [1], applying position:relative to a float to fix one bug often leads to another bug which needs consecutively position:relative on the parent ... And you have to add an inline style or a separate class just to fix it. Option B will end in containing the float, that means, the subsequent paragraphs will start beyond the image's lower edge. Not good. And C leads to the question why you initially had placed the image inside the p. For vertically aligning the image and the first paragraph, you should zero the margins and paddings of the H1 and P to bring all the browsers in par, and then apply appropriate margins to the H1, P and the img.float_img Ingo [1] http://archivist.incutio.com/viewlist/css-discuss/64573 -- http://www.satzansatz.de/css.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS problem in IE
Matthew Hackett wrote: I took the image out of the p tag. For some sites where i create pages upon pages i sometimes use dreamweaver to replicate the pages to save time, this is why the image was within the p tag. I removed the image from the p tag and have tried removing the position:relative, which as you said does seem to be buggy. This hid the image behind the layer. This is because the parent, div.content, is positioned relatively /without/ a dimension. Remove position:relative here too and add a height [1] to div.content Hope this helps. Ingo [1] http://www.satzansatz.de/cssd/onhavinglayout.html#hack __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/