XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   Designfehler (http://xhtmlforum.de/showthread.php?t=72576)

new 02.01.2016 20:57

Designfehler
 
Hallo Zusammen,

ich bastle an einem CSS-Layout und hänge an einem Fehler fest.
Ich habe schon diverse Varianten ausprobiert, weiß aber nicht weiter.

Code:

#menu {
position:relative;
background-color: #3b2d0a;
width: 885px;
height: 30px;
top: 0px;
margin-left: auto;
margin-right: auto;
}

#row1 {
position:relative;
width: 885px;
margin-left: auto;
margin-right: auto;
}


#content1 {

background-color: blue;
width: 635px;
height: 250px;
float:left;

}

#logo {

background-color: white;
width: 250px;
height: 250px;
float: right;

}

#row2 {
position:relative;
width: 885px;
margin-left: auto;
margin-right: auto;

}


#content2 {

background-color: red;
width: 635px;
height: 250px;
float:left;

}

#content3 {

background-color: black;
width: 250px;
height: 250px;
float: right;

}

#menu3 {
position:relative;
background-color: #3b2d0a;
width: 885px;
height: 25px;
top:100px;
margin-left: auto;
margin-right: auto;

}

Code:

<html>
<head>
<link rel="stylesheet" href="design.css">
</head>
<body bgcolor="#f8f6b1">
<div id="menu">test</div>
<div id="row1">

        <div id="content1"></div>
        <div id="logo"></div>

</div>

<div id="row2">

        <div id="content2"></div>
        <div id="content3"></div>

</div>
<div id="menu3">test123</div>
</body>
</html>

http://www.qpic.ws/thumbs/123jnj.jpg

Problem: Wieso ist die "2. braune DIV-Box" (menu3) nicht, wie im Code,
unter der 2. Reihe (row2), sondern irgendwie mittig im Layout?

Problem 2: Ich habe menu3 mit einer Höhe markiert - wieso wird mir
der Text "test123" dann scheinbar außerhalb dieser Box angezeigt?

Wenn ich den Code von menu (der oberen Leiste) kopiere, habe ich
den gleichen Fehler - woran liegt das?


Vielen Dank! new

MrMurphy 02.01.2016 21:35

Hallo,

an mehr oder weniger inhaltsleeren Layouts lassen sich Fehler häufig nicht nachvollziehbar erläutern.

So soll zum Beispiel die Höhe von Containern von ihrem Inhalt bestimmt werden. Dann sind auch sinnfreie height-Angaben überflüssig und stören nicht mehr.

Außerdem solltest du mal nachlesen was du mit dem großzügig verteilten position:relative, und dann auch noch im Zusammenhang mit top, anrichtest.

Gruss

MrMurphy

new 02.01.2016 21:54

Das ist ja eine tolle Hilfe :)

Ich werde alle DIV Boxen mit Hintergrundbildern "auskleiden",
damit ich am Ende ein gutes Design habe.
Meiner Meinung nach sollte ein gutes Design auch ohne Inhalte
gut auskommen, dafür sind ja die Höhen und Breitenangaben da.

Wie gesagt, erschließt es mir nicht, wieso der "Footer" (menu3)
quasi zum Schluss solche Probleme bereitet.

Auch, dass der Text meilenweit von der Div-Box entfernt ist,
erklärt sich mir nicht. Die Höhe 25px sagt alles.

Eine Idee, wie ich die Box unten an die richtige Position kriege?

Vielen Dank! new

K.Roland 03.01.2016 00:15

Zitat:

Zitat von new (Beitrag 547452)

Wie gesagt, erschließt es mir nicht, wieso der "Footer" (menu3)
quasi zum Schluss solche Probleme bereitet.

Hi,
für dich zum lesen. Float

___________
MfG Roland


Alle Zeitangaben in WEZ +2. Es ist jetzt 04:34 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2023