Autor |
Nachricht |
StreetGlow
Threadersteller
Dabei seit: 14.11.2005
Ort: Parchim
Alter: 41
Geschlecht:
|
Verfasst Di 01.02.2011 03:46
Titel Problem mit Div Layergröße |
|
|
Hallo,
ich sitze gerade an ner webseite für einen bekannten und habe nun ein kleines problem bei dem ich nicht weiterkomme.
die site ist wiefolgt aus divs aufgebaut:
oben kommt der head,
darunter kommen zwei div-layer nebeneinander (menü & content)
unter den beiden kommt der footer.
wenn ich nun viel inhalt in den content-div schreibe dann ändert sich ja automatisch die höhe und man sieht wenn der menü-div zuende ist. Hier mal ein bild als beispiel was ich meine:
ich möchte aber gerne, dass die größe bleibt und dafür ein scrollbalken erscheint und man den inhalt scrollen kann.
auch dafür habe ich mal ein bild gebastelt damit ihr seht wie ich mir das vorstelle:
Hier ist der Code der Seite (URL der seite ist http://www.daemmtechnik-lossner.de/test/index.html) :
Code: | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/Strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de"> <head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="Author" content="Mathias Hohmann" />
<meta name="description" content="Kerndämmung, Altbausanierung, Dachbeschichtung" />
<meta name="keywords" content="Lossner, Loßner, Dämmtechnik, Dämmung, Dachbeschichtung" />
<style type="text/css"><!--
body
{
font-family:Verdana;
font-size:12px;
background-color:#ffffff;
text-align:center;
margin:0px;
}
h1 {font-size:18px;color:#000000;margin-bottom:0px;}
h2 {font-size:16px;color:#000000;}
h3 {font-size:14px;color:#000000;}
a:link, a:visited, a:active, a:hover
{
text-decoration:underline;
font-weight:normal;
color:#ff0000;
font-size:12px;
}
a:active, a:hover
{
color:#009999;
}
a.menu {
display:block;
padding:3px;
border-top:1px solid #000;
background-color:#737994;
text-align:center;
color:#eeeeee;
text-decoration:none;
}
a.menu:link, a.menu:visited
{
color:#eeeeee;
background-color:#737994;
text-decoration:none; font-weight:bold;
}
a.menu:active, a.menu:hover
{
color:#0000ff; font-weight:bold;
background-color:#eeeeee;
}
#title {
height:85px;
padding:5px;
background-color:#ff0000;
border-bottom:1px solid #000;
}
#left {
background-color:#0000ff;
width:188px;
float:left;
}
.menutitle{
font-weight:bold;
text-align:center;
margin:2px;
}
.menucontainer {
border:1px solid #000;
background-color:#0099FF;
width:116px;
margin:30px;
}
#content {
border:1px solid #efeff7;
background-color:#ffffff;
width:550px;
float:right;
padding:0px 10px;
}
#footer {
heigth:85px;
padding:5px;
background-color:#0000FF;
}
//--></style>
<title>Loßner - Dämmtechnik</title>
</head>
<body>
<div style="width:760px;margin:10px auto;text-align:left;background-color:#ffffff;border:1px solid #000000;">
<div id="title">
<img src="images/head.png" style="width:640px;height:75px;margin-left:3px;" alt="Logo" />
</div>
<div id="left">
<div class="menucontainer">
<p class="menutitle">MENU 1</p>
<a class="menu" href="#">Hyperlink 1</a>
<a class="menu" href="#">Hyperlink 2</a>
<a class="menu" href="#">Hyperlink 3</a>
<a class="menu" href="#">Hyperlink 4</a>
<a class="menu" href="#">Hyperlink 5</a>
</div>
<div class="menucontainer">
<p class="menutitle">MENU 2</p>
<a class="menu" href="#">Hyperlink 1</a>
<a class="menu" href="#">Hyperlink 2</a>
<a class="menu" href="#">Hyperlink 3</a>
<a class="menu" href="#">Hyperlink 4</a>
<a class="menu" href="#">Hyperlink 5</a>
</div>
<div class="menucontainer">
<p class="menutitle">MENU 3</p>
<a class="menu" href="#">Hyperlink 1</a>
<a class="menu" href="#">Hyperlink 2</a>
<a class="menu" href="#">Hyperlink 3</a>
<a class="menu" href="#">Hyperlink 4</a>
<a class="menu" href="#">Hyperlink 5</a>
</div>
</div>
<div id="content">
<img src="images/dach.jpg" style="float:right;width:300px;height:405px"/>
<h2 style="margin-top:10px;">Hier wird der Inhalt stehen.</h2>
Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text
<p> </p>
</div>
<br style="clear:both;" />
<div id="footer">
<img src="images/footer.png" style="width:640px;height:75px;margin-left:3px;" alt="Footer" />
</div>
</div>
</body>
</html> |
ich würde mich sehr freuen wenn mir jemand weiterhelfen kann.
Gruß, Streetglow
|
|
|
|
|
bambam42
Dabei seit: 10.04.2007
Ort: Dessau
Alter: 59
Geschlecht:
|
Verfasst Di 01.02.2011 06:40
Titel
|
|
|
pack mal am anfang im CSS-Bereich folgendes
Code: |
* {
margin:0;
padding:0;
} |
Zuletzt bearbeitet von bambam42 am Di 01.02.2011 06:41, insgesamt 1-mal bearbeitet
|
|
|
|
|
Anzeige
|
|
|
Kash
Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht:
|
|
|
|
|
bacon
Dabei seit: 24.10.2007
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Di 01.02.2011 09:30
Titel
|
|
|
Traumhafte Seite. Ich glaub, langsam wirds Zeit den Hut zu nehmen.... ist ja nicht mehr auszuhalten hier.
|
|
|
|
|
Kash
Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht:
|
Verfasst Di 01.02.2011 09:33
Titel
|
|
|
bacon hat geschrieben: | Traumhafte Seite. Ich glaub, langsam wirds Zeit den Hut zu nehmen.... ist ja nicht mehr auszuhalten hier. |
Was stört Dich an dem Thema?
|
|
|
|
|
bacon
Dabei seit: 24.10.2007
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Di 01.02.2011 09:34
Titel
|
|
|
Das fachliche Niveau, Kash.
|
|
|
|
|
Kash
Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht:
|
Verfasst Di 01.02.2011 09:36
Titel
|
|
|
bacon hat geschrieben: | Das fachliche Niveau, Kash. |
Meine Lösung funktioniert. Und der Tipp mit den Faux Columns ist die einzigste Alternative.
|
|
|
|
|
bacon
Dabei seit: 24.10.2007
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Di 01.02.2011 09:38
Titel
|
|
|
Das war weniger auf Deine wie immer brillante Lösung bezogen als auf den ganzen, anlassgebenden Thread:
Zitat: | oben kommt der head,
darunter kommen zwei div-layer nebeneinander (menü & content)
unter den beiden kommt der footer. |
Alter Schwede ....
Zuletzt bearbeitet von bacon am Di 01.02.2011 09:38, insgesamt 1-mal bearbeitet
|
|
|
|
|
|
|
|
Ähnliche Themen |
Formmailer-Problem-neues problem
Problem in IE
Problem mit IE
CSS-Problem?
[CSS] IE Problem
ie7 problem?
|
|