Silver98: CSS Layout verschiebt sich sobalt ein Inhalt eingefügt wird.

Beitrag lesen

SELF-Forum

CSS Layout verschiebt sich sobalt ein Inhalt eingefügt wird.

Silver98
– Informationen zu den Bewertungsregeln

Hallo,

ich habe ein Layout mit CSS erstellt. Es besteht aus vier div boxen.
Eine oben für das Logo und zwei darunter, mit dem Menu und dem Inhalt (Menu & Inhalt nebeneinander). Die drei divs habe ich zum Zentrieren in ein weiteres div gepackt.
Soweit so gut, es schaut so aus wie ich es erwarte. Nur wenn ich jetzt ein <p></p> in die Inhaltsbox einfüge, verschiebt sich die Box um ein paar (ca 10-20px?) Pixel nach unten

+----------+
|          |
+----+-----+
|    |     |
|    |     |
|    |     |
|    |     |
|    |     |
+----+-----+
--------------------------------HTML------------------------------

  
<body>  
<div id="zentriert">  
  <div id="logo"></div>  
  <div id="menu"></div>  
  <div id="inhalt"></div>  
</div>  
</body>

------------------------------------------------------------------
--------------------------------CSS------------------------------

  
body {  
  margin: 0px;  
  padding: 0px;  
  background-color: #f4d17d;  
  font-family: Arial,Helvetica,Times New Roman,sans-serif;  
  font-size:1.0em;  
  color: #000000;  
  text-align: center;  
  
}  
  
#zentriert {  
  border-style: none;  
  border-color: black;  
  margin: 0px auto;  
  padding: 0px;  
  height: 700px;  
  width: 850px;  
  text-align: left;  
}  
  
#logo {  
  border-style: none;  
  border-color: black;  
  margin: 0px;  
  padding: 0px;  
  background-image: url(../images/logo01.gif);  
  background-position: left top;  
  background-repeat: no-repeat;  
  background-color: #f4d17d;  
  width: 850px;  
  height: 175px;  
  text-align: center;  
}  
  
#menu {  
  
  border-style: none;  
  
  border-color: black;  
  
  margin: 0px;  
  
  padding: 0px;  
  
  background-image: url(../images/bgmenu2.gif);  
  
  background-repeat: no-repeat;  
  
  width: 200px;  
  
  height: 700px;  
  
  text-align: left;  
  
  float: left;  
  
}  
  
#inhalt {  
  
  border-style: none;  
  
  margin: 0px 0px 0px 200px;  
  
  padding: 0px;  
  
  background-image: url(../images/bginhalt.gif);  
  
  width: 650px;  
  
  height: 700px;  
  
  text-align: left;  
  
  font-size: medium;  
  
  float: none;  
  
}

------------------------------------------------------------------

Beitrag melden
–
Informationen zu den Bewertungsregeln