Frage stellen
und schon wieder ein Problem mit dem DIV Element.
Ich möchte natürlich die Box um den Berichtsbereich dynamisch angepasst haben. Mit height:auto funktioniert es nicht. Bin wohl im falschen Bereich.
Ich poste hier mal den Link zur Orignalseite und die CSS und HTML Info Angaben.
Wäre nett, wenn Ihr mir sagen könnten, wo mein Fehler liegt und wie die Lösung aussieht:
Hier der Link : http://www.scl-basketball.de/redesignindex.html
Hier der HTML Code für den Bereich:
- Code: Alles auswählen
<div id='Box2'>
<div class='Titel'>TESTNAME<span class="TitelKlein">(Titel klein)</span></div>
<div class='Text1'>Text 1 Test</div>
<div class="box_kalender"><p><span>Dienstag<br>14. Jan.<br>2011</span></p></div>
<div id="boxcontainer">
<div class="box_links">
<div id="fotoboxleft">
<img src="mavsteam.jpg" alt="Testimage" />
<p>Testimage (11.06.2009)</p>
</div fotoboxleft>
<br><br>
</div box_links>
<div class="rechte_spalte">
<p><b>Spalte Rechts</b><br>Ea quo brute nihil, oportere dignissim qui no, vis primis nonummy placerat ne. No vel facete meliore, mel feugiat nostrum ne, everti impedit eu quo. Quo quas appetere eu, te praesent mediocrem efficiendi sea, mel labitur feugait in. Magna disputationi eos in, aperiri epicurei verterem ad his. Iuvaret scaevola tractatos te vim, ludus quodsi ex cum. Ex efficiendi suscipiantur mei.
<br><br>
In putent tibique per, iusto lobortis te sea, no mucius adipisci expetendis sea. Usu eu iusto maiestatis posidonium. Stet intellegam his ei, has ut omnium dignissim gloriatur. Pri ne puto vituperata.
<br><br>
Ea alii nulla mandamus usu, populo voluptua atomorum ei eam. No sit quis tritani. Omnes eligendi sit an, at est errem repudiare mediocritatem, discere propriae petentium at est. Cibo diceret no pro, semper vituperatoribus mel et.</p>
</div rechte_spalte>
</div boxcontainer>
</div box2>
und hier der CSS Code:
- Code: Alles auswählen
#boxcontainer {
float:left;
width:100%;
height:auto;
}
.box_links {
width:33%;
float:left;
}
.box_rechts {
width:33%;
float:right;
}
.rechte_spalte {
width:66%;
float:left;
}
.box_kalender {
position: absolute;
background:url(kalenderblatt.jpg) no-repeat;
left: 800px;
width: 60px;
height: 50px;
top: 0px;
}
.box_kalender p {
padding-left: 4px;
color: #000000;
font-family: Arial;
font-size: 11px;
font-weight: bold;
}
.news_bild {
position: relative;
width:280px;
height:252px;
background:url(tframe.jpg) no-repeat center center;
float:left;
}
.news_bild img {
position:absolute;
top:19px;
left:19px;
width:240px;
}
.news_bild p {
position:absolute;
left:25px;
right:25px;
top:200px;
font-size:100%;
font-family:verdana;
font-weight: bold;
background:transparent;
}
#Box2 {
border:1px solid #000000;
margin:0px;
padding:10px;
background:url(berichtsheader.png);
background-repeat:no-repeat;
height: auto;
width: 910px;
position:relative;
}
#Box2 .Titel {
font-family: Arial,Helvetica,sans-serif;
color: #000000;
font-size:20px;
font-weight:bold;
text-align: left;
}
#Box2 .TitelKlein {
font-family: Arial,Helvetica,sans-serif;
color: #0f0f0f;
font-size:16px;
font-weight:bold;
text-align: left;
}
#Box2 .Text1 {
margin-top:20px;
text-align: left;
/* abhängig vn der Breite der Grafik */
width: 280px;
font-family: Arial,Helvetica,sans-serif;
font-size:20px;
font-weight:bold;
line-height:14px;
color: #0070C0;
height:25px;
}
#Box2 .Text2 {
margin-top:2px;
text-align: left;
width: 300px;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
color: #000000;
}
Hoffe auf Eure Hilfe.
Danke dafür im Voraus.
Gruß
cssRookie
