2 replies to this topic

[zetsumei]

I have a CSS problem I can't get fixed.



In IE6, the borders are wider than the actual columns and in FireFox the problem is with the line break in the post area.

here's my css

body {
	background-color: #6c8cae;
	margin:0;
	padding:0;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

/*container layout*/
#container {
	background-color: #6c8cae;
	color: #000000;
	font-family: verdana;
	font-size: 10px;
	margin-top: 10px;
	margin-left: auto;
	margin-right: auto;
	width: 800px;
	text-align: left;
}

/*header styles*/
#head {
	background-image: url(/images/vex_header.jpg);
	background-color: #;
	color: #2474a1;
	font-family: verdana;
	font-size: 10px;
	width: 800px;
	height: 100px;
	border: 1px #000000 solid;
	text-align: left;
}

/*sidebar styles*/
#sidebar {
	width 150px;
	margin-top: 10px;
	float: left;
}
#nav {
	width: 150px;
	border: 1px #000000 solid;
	font-family: verdana;
	font-size: 10px;
	text-align: left;
}
.nhead {
	background-color: #f1f1f1;
	color: #000000;
	padding-left: 10px;
	width: 140px;
}
.nbody {
	background-color: #;
	color: #000000;
	padding-left: 10px;
	width: 140px;
}
.nfoot {
	background-color: #f1f1f1;
	color: #000000;
	padding-left: 10px;
	width: 140px;
}
#admin {
	width: 150px;
	border: 1px #000000 solid;
	font-family: verdana;
	font-size: 10px;
	text-align: left;
}
.ahead {
	background-color: #f1f1f1;
	color: #000000;
	padding-left: 10px;
	width: 140px;
}
.abody {
	background-color: #;
	color: #000000;
	padding-left: 10px;
	width: 140px;
}
.afoot {
	background-color: #f1f1f1;
	color: #000000;
	padding-left: 10px;
	width: 140px;
}

/*content styles*/
#content {
	width: 630px;
	margin-top: 10px;
	font-family: verdana;
	font-size: 10px;
	float: right;
}
.chead {
	background-color: #f1f1f1;
	color: #000000;
	padding-left: 10px;
	width: 620px;
	border-top: 1px #000000 solid;
	border-left: 1px #000000 solid;
	border-right: 1px #000000 solid;
}
.cbody {
	background-color: #;
	color: #000000;
	padding-left: 10px;
	width: 620px;
	border-left: 1px #000000 solid;
	border-right: 1px #000000 solid;
}
.cfoot{
	background-color: #f1f1f1;
	color: #000000;
	padding-left: 10px;
	width: 620px;
	border-bottom: 1px #000000 solid;
	border-left: 1px #000000 solid;
	border-right: 1px #000000 solid;
}
a:link {
	text-decoration: none;
	color: #6F86B0;
	font-family: verdana;
	font-size: 10px;
}
a:visited {
	text-decoration: none;
	color: #6F86B0;
	font-family: verdana;
	font-size: 10px;
}
a:hover {
	text-decoration: none;
	color: #9E5F5F;
	font-family: verdana;
	font-size: 10px;
}

[cheerio]

Try adding this before body{}

* {
margin:0;
padding:0;
}

It may require a few other minor changes.

[zetsumei]

That's the same thing my friend told me XD. I've tried that.

EDIT: oooo, just saw the BEFORE BODY {}

EDIT: yay, it's fixed thanks

Edited by zetsumei, 23 January 2007 - 07:45 PM.