Zeromancer: Aufbau meiner Homepage

Beitrag lesen

Hallo thomas,

wenn ich beispielsweise 3 bilder nebeneinander ausrichten möchte (diese bilden das logo) sollte das demnach also so am sinnvollsten sein:

html:
<div id="Header">
<img  src="PIX\HeaderLeft.jpg"  alt="bla" >                         <img  src="PIX\HeaderCenter.jpg" alt="bla" >
<img  src="PIX\HeaderRight.jpg" alt="bla">
</div>

Bilder sind per Definition Inline-Elemente und reihen sich im Regelfall nebeneinander an. Vergiss nicht die Angaben zu Höhen und Breiten!

css:

#Header
{
width: 100%;
height: 146px;
float: left;
}

ist insofern unsinnig, da ein Div ein Blockelement ist und im Grundfall immer 100% des zur Verfügung stehenden Raumes einnimmt. Wenn du das Div mit Inhalt füllst, z.B. Bilder, orientiert sich die Höhe des Div am Inhalt, den Bildern. Damit ist eine Höhenangabe nicht immer nötig. Die Angabe zu float ist auch unsinnig, da neben dem Div (width:100% per default) eh kein Platz mehr ist.

Solltest du auf das umschließende Header-Div verzichten wollen/können, kannst du den Bilder auch die Eigenschaft display:block zu weisen und sie dann floaten.

  
<body>  
<img src="headerleft.jpg" width="100" height="164" alt="Text" title="Text" id="headerimgleft" />  
<img src="headercenter.jpg" width="100" height="164" alt="Text" title="Text" id="headerimgcenter" />  
<img src="headerright.jpg" width="100" height="164" alt="Text" title="Text" id="headerimgright" />  
</body>  

Wobei mir die Benutzung eines geteilten Banners außer für unterschiedliche Verweise nicht ganz einleuchtet.

Mit freundlichen Grüßen,
André