3 replies [Last post]
Whoisdan
Offline
Regular
Chicago
Last seen: 16 years 34 weeks ago
Chicago
Joined: 2004-03-31
Posts: 18
Points: 0

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!

ClevaTreva
ClevaTreva's picture
Offline
Guru
A hilly place, UK
Last seen: 2 years 3 weeks ago
A hilly place, UK
Joined: 2004-02-05
Posts: 2902
Points: 0

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

Whoisdan
Offline
Regular
Chicago
Last seen: 16 years 34 weeks ago
Chicago
Joined: 2004-03-31
Posts: 18
Points: 0

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?

ClevaTreva
ClevaTreva's picture
Offline
Guru
A hilly place, UK
Last seen: 2 years 3 weeks ago
A hilly place, UK
Joined: 2004-02-05
Posts: 2902
Points: 0

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