I'm freelancing at a print design firm and they asked me to do their website. This is what I got.
I've done my best to conform to web standards, the XHTML and CSS validate, but a couple problems (which I've posted about):
-The list-style .gifs (the +signs) display to high and too far right in IE6Win. What's up with that?
-In the portfolio section, the links in 2nd tier of the list (for "Brand Identity" I mean "Aon, Family Ventures...") are supposed to be white in all stages. I spent all of yesterday failing to make that work.
-Oh, 1 more: The tail of the "p" for the phone number gets cut off in IE6Win. Ugh, again. Ideas?
Thanks for the help!
Design Firm Site
Hi
The p thing in IE is a known bug, see www.positioniseverything.net
Big John has a page (the piefecta design) that has this css in:
.italics-test, .italics-test-side { font-style: italic; text-align: justify; background: #ccd; border: 1px solid red; } /*** The following fixes prevent justified italic text from destroying the layout in IE/win. The problem is that those properties together make IE force the container wider, which in this type of floated layout causes a float drop. Pre-IE6 gets "width: 100%" and "overflow: hidden", while IE6 gets "width: auto" and "overflow: visible, which is the default, but explicitly stating it seems to keep IE6 happy. IE6 also needs to see the "height: 1%" to give it some kind of box dimension. Browser coddling we call it. Finally, Bruno found that "word-wrap: break-word;" disarranged the justified text in IE5.5 and 6, so it is defaulted to "normal" for this text. If you don't need justified and italicized text then forget all these fixes ***/ /* \*/ * html .italics-test, * html .italics-test-side { overflow: hidden; width: 100%; o\verflow: visible; w\idth: auto; he\ight: 1px; word-wrap: normal; } /* */
Trevor
Design Firm Site
Wow. That's a lot for one p. I mentioned it to da' boss, and he said to just go with a normal p. Thanks, though.
No ideas on the list-style gif butting up against the text? I can't find anything on this anywhere. Any good places to look?
Design Firm Site
Hi
Try this style instead:
ul { list-style: url(/images/smallplus.gif) outside; text-align:left; margin-left:7px; padding-left:7px; }
Don't know if it'll work. Vaguely remembered a similar problem and this did it for me. Haven't t tired it on your code (couldn't face the black, too harsh).
Trevor