Comment puis-je aligner deux blocs div horizontalement en utilisant CSS ?

Positionnement horizontal de deux blocs Div

Alignez deux blocs div sur la même ligne horizontale en utilisant les techniques CSS et HTML.

Solution :

CSS :

<code class="css">#block_container {
    text-align: center;
}
#bloc1, #bloc2 {
    display: inline;
}</code>

Dans ce CSS, on :

• Centrer le parent conteneur (#block_container) en utilisant text-align: center pour aligner horizontalement les deux blocs div.
• Définissez la propriété d'affichage des deux blocs div (#bloc1 et #bloc2) sur inline pour les faire apparaître sur la même ligne.

HTML :

<code class="html"><div id="block_container">
    <div id="bloc1"><?php echo " version " . $version . " Copyright &copy; All Rights Reserved."; ?></div>  
    <div id="bloc2"><img src="..."></div>
</div></code>

Explication :

1. Le div #block_container sert de conteneur parent pour les deux blocs div.
2. La propriété text-align de #block_container centre le contenu qu'il contient, y compris #bloc1 et #bloc2.
3. En définissant la propriété d'affichage sur inline pour # bloc1 et #bloc2, ils sont affichés sur la même ligne horizontale.

Remarques supplémentaires :

• Utilisez les balises HTML appropriées pour le placement du contenu au lieu de placer le contenu brut dans des
  s. Pour le texte, utilisez

  ou , par exemple.

• Une démonstration de cette solution peut être trouvée sur jsFiddle.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!