2010-01-13 8 views
11

¿Cómo configurar el flotador correcto para cada elemento dentro de div?¿Cómo establecer el flotante para cada elemento dentro de un div a la vez sin especificar el flotante para cada elemento dentro?

Quiero dar flotante a los elementos internos solo para no ser padres DIV?

<!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> 

Respuesta

14

Puede dirigirse a todos los hijos de un elemento con el selector *, por lo que en su ejemplo, se podría añadir:

div * { float: right; } 

Tenga en cuenta que este flotaría todos los niños y sus hijos, por lo que si tenía un contenido anidado que probablemente no es lo que quiere, en este caso, es probable que desee:

div > * { float: right; } 

sin embargo, el >direct descendant selector isn't supported in older versions of IE (y pos Sibly otros navegadores?).

10

raíz de Alconja a continuación es una buena manera de conseguir alrededor de la cuestión del selector descendiente:

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

Este flotará todo bien, entonces los hijos de todo lo que se restablecerán a ninguno.

+1

+1 Buen truco, ni siquiera pensé en eso. – Alconja

Cuestiones relacionadas