Re: [css-d] Weird spacing in IE (go figure)...
Michael Beaudoin wrote: Now, I have a little bit of a spacing problem. All my page look good in Safari, Firefox Mac and PC, but the LINKS and DOWNLOADS pages have this big space in them in IE. Would someone please go to http://www.mhinonline.com/dev and see what I have missed, or didn't do? The width of #textarea is set to 670px. The width of the paddings of #textarea p are 143px together. The width of the images used for the subheadings is 545px. 545 + 143 = 688, which is 18px too wide. Firefox just follows your orders and lets the image stick out. IE doesn't. It tries to fit it in somehow. (without real success, but by the gap you can see it tried ;-)) -- 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 footer article from A List Apart breaks when width is added (in ie6)
Hi, I use a pure CSS footer lock but have not tested it using a fixed width -might be worth a try: http://matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page Not sure why alistapart's version would break with width. If I get a chance I'll have a play with their code and see if I can get it to work. Ta, ~Mx __ 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] double borders. A different story in IE?
Fix the errors in your xhtml first. http://validator.w3.org/check?uri=http%3A%2F%2Fwww.ekebodagis. fi%2Fekebo%2Ftest.htmlcharset=%28detect+automatically%29doct ype=Inlinegroup=0 Now my example validates cleanly... It still behaves the same way though... I have actually moved on. As it took over a week to get the first response to my initial question I assumed nobody cared or had any suggestions. I solved it by using an extra DIV to give the look of a double border... See main page http://www.ekebodagis.fi Is there no visual standard for how a double border should look? Any which way, IE seems to do the double border a bit differently from all the other browsers. I'm still a bit curious why the border in IE overflows the UL-element in my example... http://www.ekebodagis.fi/ekebo/test.html Regards, Jon Wickström __ 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] double borders. A different story in IE?
On Wed, 15 Apr 2009 14:44:27 +0300 Came this utterance formulated by Jon Wickström to my mailbox: Fix the errors in your xhtml first. http://validator.w3.org/check?uri=http%3A%2F%2Fwww.ekebodagis. fi%2Fekebo%2Ftest.htmlcharset=%28detect+automatically%29doct ype=Inlinegroup=0 Now my example validates cleanly... And yet you have a fake XML declaration in line 9 which does nothing that i can see. Still would validate though. It still behaves the same way though... I have actually moved on. As it took over a week to get the first response to my initial question I assumed nobody cared or had any suggestions. Your initial post hit the list Thu, 02 Apr 2009 16:30:07 +0300. My reply went out Fri, 10 Apr 2009 08:49:20 +1200. I solved it by using an extra DIV to give the look of a double border... See main page http://www.ekebodagis.fi Is there no visual standard for how a double border should look? Any which way, IE seems to do the double border a bit differently from all the other browsers. I'm still a bit curious why the border in IE overflows the UL-element in my example... http://www.ekebodagis.fi/ekebo/test.html Not even looking at it, but can i suggest the box model bug? http://en.wikipedia.org/wiki/Internet_Explorer_box_model_bug http://www.456bereastreet.com/archive/200612/internet_explorer_and_the_css_box_model/ Which version of IE are you using? Is it in standards mode or quirks mode? You are forcing IE6 and less into quirks mode, which may be intentional. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ 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 footer article from A List Apart breaks when width is added (in ie6)
Yes, sorry, should have put that in: http://www.alistapart.com/d/footers/footer_css3.html I just successfully used the sticky-footer (http://ryanfait.com/ sticky-footer/, thank you list) But because the of my design requirements (the nav bg extends past the left and right edges -not up yet but i will post it when it is) I had to employ a faux-columns technique to get the appearance of width in the content area. What i seem to keep needing is a second box for the content area that i can style (width, bg color, etc) that will ALSO go to the bottom of the viewer. I will put a link up as soon as i can. Thanks, -Dinshaw On Apr 15, 2009, at 9:52 AM, Elias Abunassar wrote: Dinshaw, Do you have a link to the demo? Try: http://cssstickyfooter.com, not sure of the exact URL? If you Google 'Sticky Footer' you'll find it. elias On Apr 14, 2009, at 5:52 PM, Dinshaw Gobhai wrote: I have been using this footer technique for a while: http://www.alistapart.com/articles/footers uses an absolutely positioned footer Example 3 is the final version that dose not use any scripting. It looks great in ie6 (and everything else) until you add a width declaration to the container #container { position: relative; min-height: 100%; height: 100%; voice-family: \}\; voice-family: inherit; height: auto; background:url(/images/bg/blue_bg.png) -3px 0 repeat-y; /* breaks if added */ width:500px; } then the footer rises to the bottom of the content. Any one know why? Any one know a working bottom-of-the-browser-fixed footer with width technique? Thanks, -Dinshaw _ _ 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/
Re: [css-d] Weird spacing in IE (go figure)...
From: Els el...@tiscali.nl To: Michael Beaudoin mich...@ba-doyn.com; css-d@lists.css-discuss.org Sent: Wednesday, April 15, 2009 2:09:22 AM Subject: Re: [css-d] Weird spacing in IE (go figure)... Michael Beaudoin wrote: Now, I have a little bit of a spacing problem. All my page look good in Safari, Firefox Mac and PC, but the LINKS and DOWNLOADS pages have this big space in them in IE. Would someone please go to http://www.mhinonline.com/dev and see what I have missed, or didn't do? The width of #textarea is set to 670px. The width of the paddings of #textarea p are 143px together. The width of the images used for the subheadings is 545px. 545 + 143 = 688, which is 18px too wide. Firefox just follows your orders and lets the image stick out. IE doesn't. It tries to fit it in somehow. (without real success, but by the gap you can see it tried ;-)) -- Els - How would I best change this? I guess I could crop the image, but it would take a bit of the orange bar away. Thanks, Michael __ 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/IE7 border problem on list items (wrapping)
Hello, I have a list of links in a fixed-width div. Each link is in an li tag. The li tag has a border-right to create vertical separators. One of the link's text is too long and word wraps to the next line. In IE6 and IE7, there is an extra right border that appears at the end of the line for that link that is word-wrapping in addition to the correct border-right that appears on the next line. FF and IE8 do not have this problem. Here is the URL isolating the problem. http://stephentang.info/ie/test.html One solution is for me to change the CSS so that there are border-left lines on the li tags, but I was wondering if I could avoid this. Thank you for reading. --Stephen __ 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] IE6/IE7 border problem on list items (wrapping)
Hi Brian, Unfortunately, the content of the links are dynamically generated. I'd have to ask the programming team to change their code to create a vertical line explicitly. I'm trying to determine if I can avoid this. I just tried with a border-left and the problem is still there. --Stephen On Wed, Apr 15, 2009 at 2:19 PM, Brian Hazelton bdh_2...@comcast.net wrote: if the border is just for spacing, you could remove the border and put in a margin or padding and then for the vertical line seperator just use the pipe character on the keyboard. __ 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] IE6/IE7 border problem on list items (wrapping)
instead of display:inline try float:left, it won't allow the items to wrap, if it is too long for the line, it will bring it down to the next. This may not be the best answer but it should work. __ 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] IE6/IE7 border problem on list items (wrapping)
Hi Brian, Actually, the li tags are display: inline. However, there was a float: none that was taking precedence over the float: left in another class. When I remove it, I can see what IE6/IE7 is doing. The li box is actually two lines. http://www.stephentang.info/ie/test2.html Hmm, I may have to try applying borders on the anchor tag instead. --Stephen On Wed, Apr 15, 2009 at 2:36 PM, Brian Hazelton bdh_2...@comcast.net wrote: instead of display:inline try float:left, it won't allow the items to wrap, if it is too long for the line, it will bring it down to the next. This may not be the best answer but it should work. __ 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] IE6/IE7 border problem on list items (wrapping)
On Wed, Apr 15, 2009 at 11:43 AM, Stephen Tang clowwizarder...@gmail.com wrote: Hi Brian, Actually, the li tags are display: inline. However, there was a float: none that was taking precedence over the float: left in another class. When I remove it, I can see what IE6/IE7 is doing. The li box is actually two lines. http://www.stephentang.info/ie/test2.html Hmm, I may have to try applying borders on the anchor tag instead. --Stephen I had the same issue before, the only way I resolved it was to use the pipe character in the HTML. :( Apparently applying borders to inline elements is messy and should be avoided. - divya http://nimbupani.com/blog __ 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] IE6/IE7 border problem on list items (wrapping)
Ok, I tried applying this on the a tag and it's also broken in IE6/IE7. This looks like a fundamental rendering bug in IE6/IE7. I'm going to have to remove the border entirely and go explicit with a vertical pipe |. Time to go ask the programmers to make a change. --Stephen On Wed, Apr 15, 2009 at 2:43 PM, Stephen Tang clowwizarder...@gmail.com wrote: Hi Brian, Actually, the li tags are display: inline. However, there was a float: none that was taking precedence over the float: left in another class. When I remove it, I can see what IE6/IE7 is doing. The li box is actually two lines. http://www.stephentang.info/ie/test2.html Hmm, I may have to try applying borders on the anchor tag instead. --Stephen On Wed, Apr 15, 2009 at 2:36 PM, Brian Hazelton bdh_2...@comcast.net wrote: instead of display:inline try float:left, it won't allow the items to wrap, if it is too long for the line, it will bring it down to the next. This may not be the best answer but it should work. __ 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] IE6/IE7 border problem on list items (wrapping)
Hi Divya, I eventually came to that conclusion as well. I have provided instructions to the programming team to use the HTML vertical pipe in their code. Thanks for the help everybody. --Stephen On Wed, Apr 15, 2009 at 3:32 PM, divya manian divya.man...@gmail.com wrote: On Wed, Apr 15, 2009 at 11:43 AM, Stephen Tang clowwizarder...@gmail.com wrote: Hi Brian, Actually, the li tags are display: inline. However, there was a float: none that was taking precedence over the float: left in another class. When I remove it, I can see what IE6/IE7 is doing. The li box is actually two lines. http://www.stephentang.info/ie/test2.html Hmm, I may have to try applying borders on the anchor tag instead. --Stephen I had the same issue before, the only way I resolved it was to use the pipe character in the HTML. :( Apparently applying borders to inline elements is messy and should be avoided. - divya http://nimbupani.com/blog __ 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/