2013-02-25 6 views
0

À partir de ma première mise en page Tumblr. Pour une raison quelconque, les colonnes sont toutes un peu à gauche et ne sont pas centrées dans #content.Pourquoi ce div ne se centre-il pas correctement?

Je ne sais pas ce que je fais de mal ... toute aide serait très appréciée.

Aussi ... si quelqu'un qui consulte cela a des conseils ou voit une meilleure façon de faire ces colonnes, j'aimerais l'entendre.

Merci Sam

code:

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<style> 
body { 
    text-align: center; 
} 
#wrap { 
    height: auto px; 
    width: 920px; 
    margin: 15px auto; 
    border: 1px black solid; 
} 
#header { 
    margin: 10px; 
} 
#content { 
} 
#column1 { 
} 
#column2 { 
} 
#column3 { 
} 
#footer { 
} 
.title { 
    font-size:25px; 
} 
.subtitle { 
    font-size:16px; 
} 
.column { 
    width: 300px; 
    float: left; 

} 
</style> 
<title>{title}</title> 
</head> 
<body> 
<div id="wrap"> 
<div id="header"> 
<div class="title"> 
{title}</div> 
<div class="subtitle"> 
{description}</div> 
</div> 
<div id="content"> 
<div id="column1" class="column"> 
column1 
</div> 
<div id="column2" class="column"> 
column2 
</div> 
<div id="column3" class="column"> 
column3 
</div> 
</div> 
<div id="footer" class="subtittle"> 
copyright {copyrightYears} {title} 
</div> 
</div> 
</div> 
</body> 
</html> 

Répondre

0

Votre conteneur est plus 900px (300px x 3) de large.

Définir la largeur de colonne à 33,3% (près de 1/3 de la largeur du conteneur).

.column { 
    width:33.3%; 
    float: left; 
} 

http://jsfiddle.net/CZ9Lw/

Questions connexes