ungewollter Umbruch im Fluss

[fritz222]

Hallo zusammen,

Hier meine Problemsituation:

Ich habe ein Wrapper(div-Element)
Darin habe ich 3 Bilder per img-Element eingebunden.
Die Bilder sind alle drei 266 Pixel breit und hoch.

Also zwischen den Bildern und links & rechts kann es ein Abstand von 43 Pixeln haben. So wird die gesamte Breite aufgebraucht.

Ich habe ausgerechnet: 970-266*3-43*4=970

Hier mein CSS:

  
#wrapper{  
		margin-right: auto;  
		margin-left: auto;  
		width: 970px;  
		padding: 0;  
		border: 0;  
	}  
	  
img.bild_aussen{  
		margin: 0 43px 0 43px;  
	}  

Mein Problem ist, dass das rechte Bild auf eine neue Zeile kommt. Auch wenn ich die Breite des Wrappers auf 971 Pixel erhöhe oder den Margin der Bilder aussen auf 42 Pixel senke, bleibt das Problem bestehen.

Kann mir irgendjemand auf die Sprünge helfen. Ich muss einen ziemlich doofen Fehler gemacht haben oder ich versteh (X)HTML bzw. CSS noch nicht ganz.

Herzlichen Dank für Hilfe jeder Art.

[bleicher]

Grüße,
hast du zeilenumbruch zwischen den img-tags?
MFG
bleicher

[fritz222]

Nee <br/> hab ich nicht. Wenn ich den margin vom wrapper auf 1000px breit mache gehts! Ich verstehs nicht.

Hier mein HTML

<div id="header">  
			<img class="bild_aussen" src="./media/bild_links.jpg" alt="Logo Damenturnverein" width="266px" height="266px" />  
			<img class="bild_innen" src="./media/headerkreise/bild_mitte.jpg" alt="Bild Header Mitte" />  
			<img class="bild_aussen" src="./media/headerkreise/bild_rechts.jpg" alt="Bild Header Rechts"/>  
		</div>

[Matthias Apsel]

Om nah hoo pez nyeetz, fritz222!

Nee <br/> hab ich nicht. Wenn ich den margin vom wrapper auf 1000px breit mache gehts! Ich verstehs nicht.

schaff dir firebug an oder verwende in Opera oder IE > 7 die Entwicklertools (F12) und schau dir an, welche Eigenschaften deine Grafiken tatsächlich haben. Ggf. solltest du dir auch über das Box-Modell im Klaren sein.

Matthias

[fritz222]

Ich hab Firebug und hab ihn auch benutzt. Wenn ich dort das Boxmodell anschaue stimmt alles. Wie oben mein CSS Code das auch anzeigt.

@Der Martin: Stimmt das muss ich überprüfen. Ich hab es halt mit Tabs eingerückt zur besseren übersicht. Könnte das ne Rolle spielen.

Bis hier hin, danke für die Hilfe euch dreien.

[Matthias Apsel]

Om nah hoo pez nyeetz, fritz222!

@Der Martin: Stimmt das muss ich überprüfen. Ich hab es halt mit Tabs eingerückt zur besseren übersicht. Könnte das ne Rolle spielen.

http://forum.de.selfhtml.org/archiv/2010/12/t202127/

Matthias

[Encoder]

Versuch mal das so zu schreiben, wenn du verschiedene Zeilen haben willst.
<img src="..."
/><img src="..."
/><img src="..."
/>
Dann ist der Zeilenumbruch und Einrückung innerhalb des img Tags und wird nicht als irgendwas außerhalb interpretiert.

[Der Martin]

Hallo,

<div id="header">

  	<img class="bild_aussen" src="./media/bild_links.jpg" alt="Logo Damenturnverein" width="266px" height="266px" />  
  	<img class="bild_innen" src="./media/headerkreise/bild_mitte.jpg" alt="Bild Header Mitte" />  
  	<img class="bild_aussen" src="./media/headerkreise/bild_rechts.jpg" alt="Bild Header Rechts"/>  
  </div>

  
also doch Zeilenumbrüche, d.h. Whitespace.  
  
So long,  
 Martin  

-- 
Die letzten Worte des Fallschirmspringers:  
ELENDE SCHEISSMOTTEN!!  
Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(