Guten Tag,
Ich habe eine Frage zu meiner Navigations- und Infobox:
Momentan sieht meine Website wie auf diesem Bild aus... Soweit so gut. Das Problem ist einfach, dass wenn ich Text einfüge, verlängert sich die Textbox (id=right) und passt sich der länge des Textes an. Die Navigationsbox (id=left) habe ich auf eine bestimmte Länge gestellt, das sie eine gewisse Länge hat. Aber ich wollte eigentlich erreichen, dass sich die Navigationsbox automatisch der länge der Textbox anpasst. Ich finde das sieht besser aus, als wenn sie dort einzeln steht. Ich verstehe aber nicht wie. Ist das überhaupt mit CSS möglich?
Das hier ist der HTML Code (Ich habe die Inhalte entfernt, dass das ganze ein bisschen Übersichtlicher erscheint)
Das hier ist mein CSS Code, welche ich momentan für die Website benutze:
Ich hoffe ich habe den richtigen Thread für diese Frage gewählt...:neutral:
Ich habe eine Frage zu meiner Navigations- und Infobox:
Momentan sieht meine Website wie auf diesem Bild aus... Soweit so gut. Das Problem ist einfach, dass wenn ich Text einfüge, verlängert sich die Textbox (id=right) und passt sich der länge des Textes an. Die Navigationsbox (id=left) habe ich auf eine bestimmte Länge gestellt, das sie eine gewisse Länge hat. Aber ich wollte eigentlich erreichen, dass sich die Navigationsbox automatisch der länge der Textbox anpasst. Ich finde das sieht besser aus, als wenn sie dort einzeln steht. Ich verstehe aber nicht wie. Ist das überhaupt mit CSS möglich?
Das hier ist der HTML Code (Ich habe die Inhalte entfernt, dass das ganze ein bisschen Übersichtlicher erscheint)
Code:
<!DOCTYPE html>
<html>
<head>
<title>Startseite</title>
<link rel="stylesheet" type="text/css" href="design.css">
</head>
<body>
<div id="webseite">
<div id="header">
<h1>Titel des Headers</h1>
</div>
<div id="mini"></div>
<div id="main">
<div id="left"></div>
<div id="right"></div>
</div>
<div id="footer"></div>
</div>
</body>
</html>
Das hier ist mein CSS Code, welche ich momentan für die Website benutze:
Code:
body {text-align:left;
}
#webseite {
width:980px;
margin:0 auto;
}
#header {
text-align:center;
padding-top:50px;
width:980px;
height:150px;
background:#151515;
}
#header h1 {
padding-top:1px;
font-size:40px;
font-weight:bold;
color:white;
font-family:helvetica;
}
#mini{
float:left;
width:980px;
height:20px;
font-family:times new roman;
background:white;
margin-top:0px;
margin-bottom:0px;
}
#2E2E2E 32
#main {
width:980px;
}
#left {
float:left;
width:200px;
height:370px;
background:#585858;
margin-top:0px;
margin-bottom:0px;
}
#left p{
margin-left: auto;
}
#right{
float:right;
font-family:times new roman;
font-size:10pt;
width:780px;
height:370px;
background:#848484;
margin-top:0px;
margin-bottom:0px;
}
#footer {
text-align:center;
width:980px;
height:19px;
background:#BDBDBD;
clear:both;
}
Ich hoffe ich habe den richtigen Thread für diese Frage gewählt...:neutral: