zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Abstand bei verlinkten Bildern im Firefox zu groß (mit margin)

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 03.10.2006, 20:43
Benutzerbild von SanchoP
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 15.09.2006
Ort: München
Beiträge: 9
SanchoP befindet sich auf einem aufstrebenden Ast
Standard Abstand bei verlinkten Bildern im Firefox zu groß (mit margin)

Hallo,

mein Problem ist folgendes: Eine Navigation die aus sechs verlinkten Bildern besteht, die mit margin-top den richtigen Abstand voneinander bekommen sollen.
Im IE wunderbar, im Firefox ist der Abstand zu groß (komischerweise immer abwechselnd um 4 und 5 Pixel). Das zerfetzt das Layout...
nach ewigen Versuchen bin ich darauf gekommen, dass das Problem verschwindet wenn ich die Doctype-Angabe lösche. Das will ich aber nicht tun.
Hat jemand eine Idee wie ich das anders lösen könnte?

anbei noch alles was eventuell damit zu tun haben könnte im code:

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xml:lang="de" xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title></title>
<style type="text/css">
img {
	border:0px;
}
#navigation img {
	margin-top:15px;
	margin-left:15px;
	height:10px;
	margin-bottom:0px;
	padding:0px;
}
#navigation a {
	margin-bottom:0px;
	padding:0px;
}
</style>
<!-- hier ist ein Javascript für die Rollovers das keinen Einfluss auf den Abstand hat -->
</head><body >
	<div id="navigation">
		<a href="dt_index.htm" onmouseover="changeImages('navig_1', 'img/nav_dt_1h.gif'); return true;" onmouseout="changeImages('navig_1', 'img/nav_dt_1.gif'); return true;"><img name="navig_1" src="img/nav_dt_1.gif" width="60px" alt="" /></a><br />
		<a href="dt_galerie.htm" onmouseover="changeImages('navig_2', 'img/nav_dt_2h.gif'); return true;" onmouseout="changeImages('navig_2', 'img/nav_dt_2.gif'); return true;"><img name="navig_2" src="img/nav_dt_2.gif" width="57px" alt="" /></a><br />
		<a href="dt_location.htm" onmouseover="changeImages('navig_3', 'img/nav_dt_3h.gif'); return true;" onmouseout="changeImages('navig_3', 'img/nav_dt_3.gif'); return true;"><img name="navig_3" src="img/nav_dt_3.gif" width="65px" alt="" /></a><br />
		<a href="dt_preise.htm" onmouseover="changeImages('navig_4', 'img/nav_dt_4h.gif'); return true;" onmouseout="changeImages('navig_4', 'img/nav_dt_4.gif'); return true;"><img name="navig_4" src="img/nav_dt_4.gif" width="47px" alt="" /></a><br />
		<a href="dt_reservierung.htm" onmouseover="changeImages('navig_5', 'img/nav_dt_5h.gif'); return true;" onmouseout="changeImages('navig_5', 'img/nav_dt_5.gif'); return true;"><img name="navig_5" src="img/nav_dt_5.gif" width="102px" alt="" /></a><br />
		<a href="dt_extras.htm" onmouseover="changeImages('navig_6', 'img/nav_dt_6h.gif'); return true;" onmouseout="changeImages('navig_6', 'img/nav_dt_6.gif'); return true;"><img name="navig_6" src="img/nav_dt_6.gif" width="50px" alt="" /></a><br />
	</div>
</body>
</html>
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 03.10.2006, 21:31
Benutzerbild von BreiteSeite
<![CDATA[
neuer user
 
Registriert seit: 13.08.2005
Beiträge: 33
BreiteSeite befindet sich auf einem aufstrebenden Ast
Standard

Und wenn Du die Navi ersteinmal als Liste machst und danach: * {margin:0;padding:0} ?
__________________
Mit freundlichen Grüßen
BreiteSeite
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 07.10.2006, 11:07
Benutzerbild von SanchoP
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 15.09.2006
Ort: München
Beiträge: 9
SanchoP befindet sich auf einem aufstrebenden Ast
Standard

habe es mit der Liste versucht, das Problem bleibt genauso bestehen

Code:
#navigation {
	list-style-type:none;
	margin:0px;
	padding:0px;
}
Mit XHTML 1.0 Transitional sieht es so aus wie ich es haben will (wobei es mit ul/li auch dann nicht funktioniert)

Dennoch ist das ein workaround das ich eigentlich nur machen will, wenn es nicht anders geht. Vielleicht hat noch jemand eine Idee wie man das modern macht?

Geändert von SanchoP (07.10.2006 um 11:16 Uhr)
Mit Zitat antworten
  #4 (permalink)  
Alt 07.10.2006, 11:51
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.779
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Eine "moderne" Navigation gehört in eine Liste!

Bei deinem Beispielcode gibt es im div #navigation ausschließlich inline-Elemente.
Hier kannst du nachlesen, wie die Höhen im Inline-Kontext bestimmt werden: http://www.w3.org/TR/CSS21/visudet.html#Computing_heights_and_margins
Und zu ungewollten "Abständen" zwischen Bildern: http://www.carsten-protsch.de/zwisch...e/luecken.html
Mit Zitat antworten
  #5 (permalink)  
Alt 08.10.2006, 11:43
Benutzerbild von SanchoP
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 15.09.2006
Ort: München
Beiträge: 9
SanchoP befindet sich auf einem aufstrebenden Ast
Standard

Vielen Dank fricca!
Der zweite Link hat genau mein Problem getroffen.
Man findet manchmal nur sehr schwer die richtige Seite, in diesem Fall hätte ich sie vielleicht gar nicht gefunden.
Danke nochmals, hat mich gerettet.
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
firefox macht probleme bei navigationsliste... Bartle CSS 0 28.04.2010 19:21
Browser Zoom - Divs vergrößern sich nicht mit mathias81 CSS 19 04.08.2009 08:58
100% Höhenlayout verursacht ein Margin am Seitenende (nur im Firefox) dlange CSS 2 30.07.2009 14:51
negatives Margin und Firefox otomo CSS 2 14.02.2005 12:22
margin bei Tabellen und Bildern Wayld CSS 2 01.06.2004 14:10


Alle Zeitangaben in WEZ +2. Es ist jetzt 17:00 Uhr.