span mit white-space: nowrap im Firefox

Status
Nicht offen für weitere Antworten.

Layna

Erfahrenes Mitglied
Hallo.
Ich war eigentlich der Meinung dass white-space:nowrap sich nur auf die whitespaces INNERHALB des spans dass diesen Befehl hat auswirkt. Leider ist Firefox anderer Meinung.
Ich habe folgendes HTML:

HTML:
		<div id="nav">   
		<span style="bottom: 0px; position:absolute; width: 100%; text-align:center;">  
		<span style="white-space: pre-nowrap"><a href="index.php?id=67" onfocus="blurLink(this);">Hochzeitsfotos</a></span><span style="white-space: pre-nowrap"><a href="index.php?id=66" onfocus="blurLink(this);">Bewerbungsfotos</a></span><span style="white-space: pre-nowrap"><a href="index.php?id=65" onfocus="blurLink(this);">Traumfotos</a></span><span style="white-space: pre-nowrap"><a href="index.php?id=64" onfocus="blurLink(this);">Mehr schöne Fotos</a></span><span style="white-space: pre-nowrap"><a href="index.php?id=63" onfocus="blurLink(this);">Öffentliche Fotos</a></span><span style="white-space: pre-nowrap"><a href="index.php?id=62" onfocus="blurLink(this);">Gebäudefotos</a></span><span style="white-space: pre-nowrap"><a href="index.php?id=61" onfocus="blurLink(this);">Versteckte Fotos</a></span> 
  		</span>
  		</div>
(auf das onFocus besteht aus irgend einem Grund der Typo3)

Dazu gehörig CSS:
CSS:
#nav a, #nav a:link {
	color: #B22222;
	font-weight: bold;
	text-decoration: none;
	padding: 10px;
	padding-top: 0px;
	padding-bottom: 20px;
	text-decoration: none;
	vertical-align: bottom;
	background-color: #909090;
	overflow: auto;
	border: 1px solid black;
	border-bottom: none;
}

#nav a:active, #nav a:focus, #nav a:hover {
	color: #DC143C;
}

Zur abwechlung macht mal der IE was er soll: umbrüche VOR oder HINTER einem Link, nicht mitten drinne.
Der firefox hingegen bricht die Zeile mit den Links GAR NICHT mehr um, weder im Link noch zwischen den Links.

Hat jemand 'ne idee wie ich das so hinkriege dass beide Browser zweichen den links umbrechen?
Danke :)
 
Hi,

die white-space-Eigenschaft lässt sich nur auf Block-Elemente oder auf Inline-Elemente mit "Block-Level-Charakteristika" anwenden.

Versuch es mal hiermit:

Code:
span {
display: block;
float: left;
white-space: nowrap;
}
 
Also, Umbrechen tut er jetzt richtig.... dafür klappt die mittige Ausrichtung nicht mehr.

Ich hatte mehr oder weniger durch Zufall den Effekt in der ersten Grafik bekommen... das hätte ich nun gerne OHNE Umbruch-Probleme... Aktueller Status ist in Grafik 2.
 

Anhänge

  • grafik1.jpg
    grafik1.jpg
    12,7 KB · Aufrufe: 172
  • grafik2.jpg
    grafik2.jpg
    13,7 KB · Aufrufe: 153
Status
Nicht offen für weitere Antworten.
Zurück