[thelist] css help

Egor Kloos studio at dutchcelt.nl
Tue Aug 5 15:38:05 CDT 2003


>  - if i use the padding-left attribute, the gray column extends into 
> the content area by 15 px -
Well your problem is not that you're box is too wide (170px) but you 
are use padding in the wrong place.Namely in your <a> tags, these are 
also 170px wide + 15px padding and that comes to 185px. That is why it 
extends like that.

a.mission:link, a.board:link, a.tips:link {
	width: 170px;
	padding: 10px 0px 10px 15px;

This problem is common but is also easy to fix:
You should always avoid padding, borders and or margins on any object 
where its width is critical.

.leftnav {width:170px}
	It is only in here do you place the width.
.navspacer {padding: 10px 0px 10px 15px;}
	This is where you put your padding. You could put it the <a> selector 
as long you don't use width.
a.mission {display: block;}
	you can use block here to force it to the width of its parent box.

> this version has not been tested on a pc
Always test for a PC, especially one as big a market as Windows. Even 
trough early stage of building your stylesheets. There is no need for 
platform alienation, Mac and Linux users get enough of that.

I hope this helps.


Egor Kloos


More information about the thelist mailing list