Frage stellen
Nun traue ich mich doch zum erstenmal in ein Forum und hoffe jemand kann mir helfen. Ich beiße mir schon eine ganze Weile die Zahne an diesem Problem aus und verstehe einfach nicht warum der IE nicht reagiert.
Das Problem ist das ich die Box als overflow hidden im IE haben möchte. Im Opera und firefox funktioniert es, doch naja der lieber IE spielt wieder sein eigenes Spiel.
Gleichzeitig möchte ich die zukünftigen Bilder in der Boxmitte zentrieren (geht das überhaupt in diesem Fall?).
Wahrscheinlich schlaft ihr alle noch in good old Germany, aber vielleicht gibt es gerade jemanden der mir helfen kann der die Nacht zum Tag gemacht hat.
gruss
Frangipeni
CSS:
- Code: Alles auswählen
* {margin: 0; padding: 0; }
html, body {
height: 100%;
}
body {
font-family: verdana, helvetica;
}
h1, h2, h3, h4, h5, h6 {
margin-bottom: 0.5em;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
h1 {
font-size: 0.75em;
}
h2 {
font-size: 1.2em;
}
h3, h4, h5, h6 {
font-size: 1.1em;
}
p {
font-family: Verdana, Arial, Helvetica, sans-serif;
}
a {
color:#330;
text-decoration: underline;
border-width: 0px;
}
a.active {
color:#330;
}
a:link {
color: #330;
border-width: 0px;
}
a:hover {
color:#663;
text-decoration: underline;
}
a:visited {
color: #663;
text-decoration: underline;
}
/*Videobox*/
#videobox {
width: 90%;
height:auto;
overflow: hidden;
clip:auto;
margin-top: 2.5em;
text-align: center;
}
#vb_lt {
/*background-image: url(/themes/anx_php/vb_lt.gif);*/ /* vorlaeufig ausgeschaltet*/
background-repeat: no-repeat;
width: 27px;
height: 25px;
float: left;
background-color: #656531;
}
#vb_t {
/*background-image: url(/themes/anx_php/vb_t.gif);*/ /* vorlaeufig ausgeschaltet*/
background-color: #656531;
background-repeat: repeat-x;
width: 100%;
height: 25px;
}
#vb_rt {
/*background-image: url(/themes/anx_php/vb_rt.gif);*/ /* vorlaeufig ausgeschaltet*/
background-repeat: no-repeat;
width: 27px;
height: 25px;
float: right;
background-color: #656531;
}
#vb_m {
background-color: #656531;
width: auto;
overflow: hidden;
min-width: 800px;
}
#vb_r {
/*background-image: url(/themes/anx_php/vb_r.gif);*/ /* vorlaeufig ausgeschaltet*/
background-repeat: repeat-y;
background-position: right 0;
width: 28px;
height: 100px;
}
#vb_lb {
/*background-image: url(/themes/anx_php/vb_lb.gif);*/ /* vorlaeufig ausgeschaltet*/
background-repeat: no-repeat;
background-color: #656531;
width: 27px;
height: 25px;
float: left;
}
#vb_b {
/*background-image: url(/themes/anx_php/vb_b.gif);*/ /* vorlaeufig ausgeschaltet*/
background-color: #656531;
background-repeat: repeat-x;
width: 100%;
height: 25px;
}
#vb_rb {
/*background-image: url(/themes/anx_php/vb_rb.gif);*/ /* vorlaeufig ausgeschaltet*/
background-repeat: no-repeat;
background-color: #656531;
width: 27px;
height: 25px;
float: right;
}
/*videocontent*/
.vb_middle {
height: 100%;
background-color: #656531;
padding-left: 27px;
overflow: hidden;
}
.vb_middle p {
color: #F0F0C5;
font-size: 0.6em;
text-align: center;
padding-top: 3px;
}
.vb_middle li {
display: inline;
float: left;
padding: 0px 10px 0px 0px;
}
.vb_middle img {
padding: 3px;
border: 1px solid #FFFFFF;
background-color: #A3A352;
height: 90px;
width: 120px;
}
HTML code:
- Code: Alles auswählen
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="videobox.css" rel="stylesheet" type="text/css" media="all" />
<title>test videobox</title>
</head>
<body>
<div id="videobox">
<div id="vb_t">
<div id="vb_lt"></div>
<div id="vb_rt"></div>
</div>
<div id="vb_m">
<ul class="vb_middle">
<li><a href="#"><img src="#" alt="" /></a>
<p>xxxx<br />
xxxxx xxxx</p>
</li>
<li><a href="#"><img src="#" width="120" height="90" alt="" /></a>
<p>xxxx<br />
xxxx xxxx</p>
</li>
<li><a href="#"><img src="#" width="120" height="90" alt="" /></a>
<p>xxxx<br />
xxxxx xxx</p>
</li>
<li><a href="#"><img src="#" alt="" /></a>
<p>xxxxx<br />
xxxxx xxx</p>
</li>
</ul>
</div><!--end vb_m-->
<div id="vb_b">
<div id="vb_lb"></div>
<div id="vb_rb"></div>
</div>
</div><!-- end videobox-->
</body>
</html>
