2009-10-26 4 views
1

Comment définir un flottant défini comme centre dans css? En fait, j'ai besoin d'une mise en page entre la droite et la gauche et j'ai également essayé "text-align", mais cela ne fonctionne pas et la propriété "float" fonctionne.Définir float comme centre dans css

Merci

+0

Les deux techniques pour yopefonic et dcaunt sont parfaitement valables (malgré le commentaire de Dcaunt). Ils ont tous deux leurs cas d'utilisation spécifiques et leurs inconvénients. –

+0

Peut-être, mais je pense que la technique de yopefonic est obscurcie - les développeurs devraient savoir comment l'alignement de texte fonctionne avec la marge automatique 0 pour obtenir le centrage - c'est souvent nécessaire. Il est également plus facile à maintenir si les largeurs changent. –

Répondre

10

Vous voulez quelque chose comme ceci:

<div style="width: 500px; text-align: center;"> 

    <div style="margin: 0 auto; width: 100px;">I am centered</div> 

</div> 

La clé est un texte-align: center sur le parent, et une marge: 0 auto sur l'élément interne

+0

le meilleur moyen^o^ –

+0

la manière la plus applicable et la plus commune. –

0

Vous ne pouvez faire flotter un élément à gauche ou à droite.

Décrivez peut-être le type de mise en page que vous essayez d'obtenir.

1

Il n'y a pas de float: center. mais quand vous voulez un div être centrée à son parent ce qui devrait faire l'affaire:

#parent-element{ 
    position: relative; 
} 
#element 
{ 
    width: 500px; 
    left: 50%; 
    margin-left: -250px; /* - (width/2) */ 
    position: absolute; 
} 

mais, qu'est-ce que vous essayez d'atteindre exactement?

+1

CSS comme ce n'est jamais une bonne idée –

+0

@dcaunt, je downvote votre commentaire si je le pouvais. Bien que cette technique puisse entraîner des problèmes sur les petits écrans, il est parfois nécessaire de résoudre un problème, en particulier avec des mises en page complexes en couches. La solution la plus courante est la vôtre, mais celle de Yopefonic n'est pas * erronée *. –

+0

Quel est le meilleur cas d'utilisation pour cette approche de l'alignement de texte? Mon commentaire aurait pu être trop dur! –