2010-01-13 17 views
11

Wie Float für jedes Element innerhalb div festlegen?Wie setze man float für jedes Element innerhalb eines div auf einmal ohne spezifizierenden Float für jedes Element im Inneren?

Ich möchte Float innerhalb Elemente nur nicht zu Eltern DIV geben?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
<title>Sandbox</title> 
<meta http-equiv="Content-type" content="text/html; charset=utf-8" /> 
<style type="text/css" media="screen"> 
body { background-color: #000; font: 16px Helvetica, Arial; color: #fff; } 
div {border:2px solid red;height:50px} 
a {border:2px solid blue;margin:10px} 
</style> 
</head> 
<body> 

<div> 
<a>Hello from JS Bin</a> 
    <a>from JS Bin</a> 
    </div> 
</body> 
</html> 

Antwort

14

Sie können alle Kinder eines Elements zielen auf den * Selektor, so in Ihrem Beispiel, könnten Sie hinzufügen:

div * { float: right; } 

Beachten Sie, dass dies alle Kinder schwimmen würden und ihre Kinder, wenn Sie also geschachtelten Inhalt hatte, es ist wahrscheinlich nicht das, was Sie wollen, in diesem Fall, dass Sie wahrscheinlich wollen:

div > * { float: right; } 

jedoch den >direct descendant selector isn't supported in older versions of IE (und po vielleicht andere Browser?).

10

von Alconja unten Im Anschluss an ist ein guter Weg, um den Abkömmling Selektor Ausgabe des Erhaltens:

div *{ float: right; } 
div * *{ float: none; } 

Das wird richtig schwimmt alles, dann werden die Kinder alles zu keinem zurückgesetzt werden.

+1

+1 Netter Trick, ich habe nicht einmal daran gedacht. – Alconja

Verwandte Themen