Hallo,
ich muss im Rahmen einer Hausarbeit eine kleine Homepage basteln und bei manchen Darstellungen verstehe ich nicht warum es so gemacht wird.
So komme ich mal zum ersten Problem:
CSS:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
| #content {
margin: 0px 0px 20px 200px; /*Platz für die linke Spalte von 200px*/
padding: 10px 10px 10px 30px;
line-height: 140%;
text-align: left;
}
#content h1 {
float: left;
font-size: 24px;
color: #99FF00;
}
#content h2 {
float: left;
width: 760px;
font-size: 16px;
color: #99FF00;
margin-bottom: 3px;
}
#content p {
float: left;
font-size: 14px;
color: #99FF00;
}
.image {
margin: 2px 5px;
border: 2px solid #99FF00;
} |
HTML:
Quelltext
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
| <div id="content">
<h2>Hallo Test Test</h2>
<p>Hallfwefrwgrefgregregregwregetgtreggggg445z456z45t3g35wh456g5g45gh645h4th4
</p>
<img src="images/cod_cover.jpg" class="image" />
<h3>Hahaha</h3>
<p>Jaja das ist ein toller text denn dieser text wird immer länger und länger um zu testen dass der text hinten auch nicht überlauft und schän in der nächsten zeile anfängt so wie es sich gehört.</p>
<p>das waren jetzt zwei absätze die hoffentlich ihre wirkung zeigen ups da war noch einer.</p>
<p>Ich hoffe der text rutscht in die nächste reihe</p>
<img src="images/cod_cover.jpg" class="image" />
</div> |
Wie das ganze dann aussieht, im fehler_01.png (siehe Anhang).
Frage, warum macht er mir mit <br /> keinen Zeilenumbruch oder eine leere Zeile, sollte doch eigentlich damit gehen?
Liegt es an irgendeiner CSS Definition von mir? Ich blicke da manchmal nicht durch warum es jetzt ausgerechnet so dargestellt wird.
So, jetzt zur zweiten Frage (Problem):
CSS
Quelltext
1:
2:
3:
4:
5:
6:
7:
8:
| #wrapper {
width: 1000px;
position: absolute;
margin: 30px 100px 30px 100px;
background-color: #4c4c4c;
border-left: 1px solid #333333;
border-right: 1px solid #333333;
} |
Lasse ich die absolute Positionierung weg, macht er mir auch das bottom margin, setzte ich den Wrapper auf absolut positioniert, wird unten kein margin gemacht und die Seite hat unten keinen Freiraum mehr(Siehe Anhang frage_02_1.png und frage_02_2.png).
Dem Wrapper sind untergeordnet:
- header
- linke Menü Spalte (Navigation und kleine Textbox)
- content Bereich
- footer
Warum also einmal das margin und einmal nicht?
Hoffe ihr könnt mir da mal ein bisschen auf die Sprünge helfen.
Schönen Gruß,
Dude566
Es gibt 10 Gruppen von Menschen: diejenigen, die das Binärsystem verstehen, und die anderen.
Dude566