2010-05-19 6 views
0

Je ne sais pas pourquoi, après avoir rencontré ce problème des dizaines de fois, la réponse semble toujours différente et je n'arrive pas à me frayer un chemin à travers le processus de résolution de problèmes, mais ici, je suis de nouveau avec divs mal alignés.Je suis toujours coincé ici ... Divs ne se comporte pas correctement (problèmes d'alignement)

J'ai 3 colonnes encapsulant. chaque rangée doit avoir (au moins) 3 colonnes (et probablement des divs imbriqués en bas de la ligne, mais je ne suis même pas encore là). J'essaie de faire un morceau fluide au centre finalement, avec de jolis coins. Cependant, ma rangée supérieure montre déjà des signes de mauvaise conduite. > .O

S'il vous plaît aider avec mes questions stupides!

Bravo et merci d'avance!

<!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"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Untitled Document</title> 
</head> 

<style type="text/css"> 

#wrap { 
    margin:auto; 
    width:80%; 
    height:75%; 
    border: solid #066 1px;} 

#row1 { 
    width:100%; 
    height:10%; 
    background:#F20; 
    } 
    #r1c1 { 
     float:left; 
     width:05%;} 
    #r1c2 { 
     float:left; 
     width:80%} 
    #r1c3 { 
     clear:both; 
     width:05%; 
     } 


#row2 { 
    float:none; 
    width:100%; 
    background:#0C6; 
    } 
#r2c1 {} 
#r2c2 {} 
#r2c3 {} 



#row3 { 
    width:100%; 
    height:15%; 
    background:#00F; 
    clear:both; 
    } 
#r3c1 {} 
#r3c2 {} 
#r3c3 {} 



</style> 

<body> 

<div id="wrap"> 
<div id="row1"> 
    <div id="r1c1">LEFT</div> 
    <div id="r1c2">CENT</div> 
    <div id="r1c3">RIGHT</div> 
    </div> 

<div id="row2"> 
MIDDLE 
    </div> 

<div id="row3"> 
BOTTOM 
    </div> 


</div> 
</body> 
</html> 
+0

Poster sur Doctype pls ... voir faq! – Simon

+0

ligne 1 colonne 3 doit être flottante: aucune ou flottante: gauche, ne pas effacer. pour le reste, tl; dr – davidosomething

+0

@Simon: Vrai, SO ne peut pas être considéré comme entièrement pertinent pour cette question - http://www.doctype.com est plus pertinent. –

Répondre

0

peut-être que vous voulez ça?

sur R1C3 supprimer clairement à la fois, et d'utiliser à la place float:right, ou alternetively ajoutez juste à la fin de votre css, il va simplement remplacer ceux que vous avez actuellement

#r1c3 { clear: none } 
#row1 { overflow: hidden } 
Questions connexes