Ik heb een layout ontworpen en hierop volgend in stukjes gesneden.
Met div's en css de layout weer in elkaar gezet. Helemaal perfect in IE, maar ff, vrij veel door elkaar.

Hoe kan ik dit oplossen? Zijn er bepaalde dingen in mijn css bestandje die ik moet veranderen? Welke functie's oid geven meestal de fouten?

Ik hoop dat iemand mij wat verder kan helpen.

Mvg,

Roy
Is je CSS valid?
Altijd even een linkje geven zodat mensen het kunnen bekijken. Nu is het 'glazen bol' kijken.
@Roy

Ga slicen zodat het in FF goed is, vaak kan je dan met een paar kleine aanpassingen (als die al nodig zijn) zorgen dat het ook in IE goed is;.
Hierbij mijn stylesheet, ik hoop dat iemand mij zo kan vertellen wat er veranderd moet worden om het in FF ook goed te laten werken...


* {
	margin: 0;
	padding: 0;
}

body { 
    margin: 0px; 
    padding: 0px; 
    background: #515151; 
    color: #FFF;
    font-family: Verdana; 
    font-size: 11px;   
} 

#container { 
    margin: 0px auto; 
    padding: 0px; 
    width: 900px; 
    background: #515151; 
    border: 1px solid #000; 
}

#header {
	width: 900px;
	height: 75px;
	background: url(../images/1.jpg) no-repeat; 
}

#slogan {
	width: 296px;
	height: 50px;
	background: url(../images/2.jpg) no-repeat;
	float: left;
}

#menu {
	width: 604px;
	height: 50px;
	background: url(../images/3.jpg) repeat-x;
	font-weight: bold;
	color: #FFF;
}

#menu ul {
	padding-left: 180px;
	list-style: none;
	float: left;
	width: 100%;
}

#menu li {
	display: inline;
}

#menu li a {
	padding: 15px;
	color: #fff;
	text-decoration: none;
	float: left;
}

#menu li a:hover {
	background: url(../images/8.jpg) repeat-x;
}

#content {
	width: 900px;
	background: #272727;
}

#content-left{
	padding-top: 25px;
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 25px;
	width: 676px;
	float: left;
}

#content-right{
	padding-top: 25px;
	width: 184px;
}

#content-right-top{
	width: 184px;
	height: 20px;
	background: url(../images/4.jpg) no-repeat;
}

#content-right-mid{
	width: 184px;
	background: url(../images/5.jpg) repeat-y;
	color: #A3D200;
	padding-left: 15px;
}

#content-right-down{
	width: 184px;
	height: 20px;
	background: url(../images/6.jpg) no-repeat;
}

#footer{
	width: 900px;
	height: 117px;
	background: url(../images/7.jpg) no-repeat;
}

h1 {
	font-size: 14px;
	color: #a3d200;
	margin-bottom: 14px;
	font-weight: bold;
}

h2 {
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 5px;
}
niet niet met alleen een stylesheet. Een werkend voorbeeld is het enige wat goed werkt in dit soort gevallen...

Reageren