zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden IE: Warum Umbruch innerhalb eines float-Elements?

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 05.12.2005, 13:06
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 11.01.2005
Ort: Berlin
Beiträge: 2.152
mazzo wird schon bald berühmt werden
Standard IE: Warum Umbruch innerhalb eines float-Elements?

Hallo,

ich find grad keine Lösung für ein kleines Float-Darstellungs Problem. Ich hab unterschiedlich viele Radiobuttons mit kurzem erklärendem Textlink daneben. Diese sollen immer so dargestellt werden, dass ein <span>, welche den Button und den Textlink enthält, entweder in eine Zeile passt oder erst in der nächsten Anfängt:

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
 <title>Fieldsettest</title>
 <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
 <style type="text/css">
fieldset {
 		overflow: auto;
 	}

 	fieldset span {
	float: left;
	margin-left: 1em;
}
 </style>  
</head>
<body>   
<fieldset>
 <legend>Diverses</legend>
   <h3>Bitte w&auml;hlen Sie etwas aus:</h3>
    <span><input type="radio" name="asd" value="asd" />Hier steht ein Name</span>
    <span><input type="radio" name="asd" value="asd" />Hier steht ein anderer Name</span>
    <span><input type="radio" name="asd" value="asd" />Hier steht Hallo</span>
    <span><input type="radio" name="asd" value="asd" />Tag auch</span>
    <span><input type="radio" name="asd" value="asd" />noch ein Radiobutton</span>
 </fieldset>
</body>
</html>
Im FF und Opera wird der gesamte Inhalt des <span> bei verkleinern des Fensters in eine neue Zeile gefloatet. So soll es sein.
Im IE erscheint ein Umbruch innerhalb des <span> und es bildet sich ein unschöne Stufe. Der Effekt ist auf dem screenshot gut zu erkennen.

Hab ich was übersehen oder ist dies ein "reines IE-Problem" (Ditsche...)? Und wie lässt sich das beheben, so das der gewünschte Effekt auf den Browsern gleich (gut) aussieht.

Mit display: inline wird ja innerhalb des Elements umgebrochen und da es je nach genereierung unterschiedlich viele Buttons und unterschiedlich lange Textlionks dazu gibt, kann ich umbrüche oder zwischenzeitliche clears nicht hart eingeben.
Angehängte Grafiken
Dateityp: gif umbruchie.gif (3,0 KB, 104x aufgerufen)
Dateityp: gif umbruchff.gif (3,0 KB, 102x aufgerufen)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 05.12.2005, 13:11
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.854
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Allgemein verhindert man Zeilenumbrüche mit white-space: nowrap;, damit kannst Du ja mal etwas herumprobieren, z.B. so:
Code:
fieldset span {
float: left;
margin-left: 1em;
white-space: nowrap; }
Schöne Grüße,
Heiko
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 05.12.2005, 13:15
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 11.01.2005
Ort: Berlin
Beiträge: 2.152
mazzo wird schon bald berühmt werden
Standard

Danke! So einfach kann das sein
ich hatte mich völlig auf das floatierte span als Blockelement versteift und nowrap völlig ausser Acht gelassen.
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
Verschiebungen bei größerem Bildschirm seelefant CSS 4 28.07.2014 16:43
CSS von Plugin beisst! expand CSS 0 28.09.2012 18:44
joomla template wrock CSS 2 06.04.2012 20:24
CSS - CMS - lange Menus Balken/BG oben? shinobi CSS 3 13.10.2011 22:12
Webseite für Smartphones Optimieren. Cybertronic CSS 8 25.08.2011 12:44


Alle Zeitangaben in WEZ +2. Es ist jetzt 04:53 Uhr.