Moin!
Habe meine css Linkboxen gerade schick fertig gestellt.
Funktioniert gut, skaliert auch im ie dank em, ist aber leider nicht valide...
Meldung:
document type does not allow element "div" here; missing one of "object", "ins", "del", "map", "button" start-tag
bezieht sich auf:
HTML-Code:
<dt><div class="servbox_topli"> </div><div class="servbox_topmi">
die dt-div verschachtelung kam mir schon etwas seltsam vor, aber anders hab ich die Skalierung mitsamt der Hintergrundgrafiken nicht hinbekommen.
Der Header (dt) meiner Linkboxen besteht aus drei Hintergrundbildchen: links ne dunkelblaue ecke, rechts ne hellblaue ecke, dazwischen ein verlauf sowie der boxheadertext.
Hat jemand ne Idee wie man das ganze
valide hinbekommt?
Gruß Jackie
zum anschauen:
http://jackie-o.gmxhome.de/layouttes...boxtest_2.html
code:
HTML-Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>serviceboxtest</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
<!--
/* allgemein */
* {
font-size: 100%;
margin:0;
padding:0;
}
html {
height:100%;
width: 100%
}
body {
text-align:center;
font-family: Verdana, Arial, Sans-Serif;
background-color:#ABC2E5;
padding: 0;
margin: 0;
color:#fff;
font-size : 1em;
height: 100%;
}
/* ab hier .......................... */
#marginboxservice {
float: right;
text-align: left;
width: 11.9375em;
color: #fff;
voice-family: "\";
}\"";
voice-family:inherit;
width: 11.9375em;
}
html>body #marginboxservice {
width: 11.9375em;
}
/* margin innereien */
.smallLinkbox_right {
text-align: left;
width: 11.75em;
margin: 0 0 0.1875em 0.1875em;
padding: 0;
voice-family: "\"}\"";
voice-family:inherit;
width: 11.75em;
}
html>body .smallLinkbox_right {
width: 11.75em;
}
/* linkbox definierte Listen */
dl {
width: 11.75em;
margin: 0;
padding: 0;
background: #99AECD;
}
dt {
width: 100%;
height: 2em;
margin: 0 0 0.7em 0;
padding: 0;
font-size: 0.70em;
font-weight: bold;
border-bottom: 0.0625em solid #fff;
background: #6C81BA;
}
dd {
clear: right;
margin: 0 0 0 0.625em;
padding: 0 1.25em 0.3125em 1em;
font-size: 0.70em;
background: #99AECD url(images/arrow.gif) no-repeat 0 0.3125em;
background-position:0.25em 0.35em;
}
.servbox_topli {
width: 10px;
height: 2em;
float: left;
background: #40529A url(images/servbox_topli.jpg) no-repeat top left;
}
.servbox_topmi {
padding: 0 0 0 0;
width: auto;
height: 2em;
line-height: 2em;
float: left;
background: #6C81BA url(images/servbox_topbg.jpg) repeat-y top left;
}
.servbox_topre {
width: 10px;
height: 2em;
float: right;
background: #6C81BA url(images/servbox_topre.jpg) no-repeat top right;
}
.boxkantebot {
display: block;
padding: 0;
margin: 0;
border:0;
width: 11.75em;
height: 0.3125em;
}
//-->
</style>
</head>
<body style="background: #FFFFFF;">
<!-- Servicebox 1 //-->
<div id="marginboxservice">
<div class="smallLinkbox_right">
<dl>
<dt><div class="servbox_topli"> </div><div class="servbox_topmi">Servicelinks1</div><div class="servbox_topre"> </div></dt>
<dd>Lorem ipsum dolor sit amet</dd>
<dd>Link 2</dd>
<dd>Link 3</dd>
<dd>Link 4</dd>
<dd>Link 2</dd>
<dd>Link 3</dd>
<dd>Link 4</dd>
</dl><img class="boxkantebot" src="images/servbox_unten.jpg" alt="" /></div>
<!-- Servicebox 2 //-->
<div class="smallLinkbox_right">
<dl>
<dt><div class="servbox_topli"> </div><div class="servbox_topmi">Servicelinks2</div><div class="servbox_topre"> </div></dt>
<dd>Lorem ipsum dolor sit amet</dd>
<dd>Link 2</dd>
<dd>Link 3</dd>
<dd>Link 4</dd>
<dd>Link 2</dd>
<dd>Link 3</dd>
<dd>Link 4</dd>
</dl><img class="boxkantebot" src="images/servbox_unten.jpg" alt="" /></div>
<!-- Servicebox 3 //-->
<div class="smallLinkbox_right">
<dl>
<dt><div class="servbox_topli"> </div><div class="servbox_topmi">Servicelinks3</div><div class="servbox_topre"> </div></dt>
<dd>Lorem ipsum dolor sit amet</dd>
<dd>Link 2</dd>
<dd>Link 3</dd>
<dd>Link 4</dd>
<dd>Link 2</dd>
<dd>Link 3</dd>
<dd>Link 4</dd>
</dl><img class="boxkantebot" src="images/servbox_unten.jpg" alt="" /></div>
</div>
</body>
</html>