How do I align two Div blocks on the same line using CSS?

Aligning Two Div Blocks on the Same Line

To align two div blocks on the same line, you can use CSS properties like text-align and display.

CSS:

<code class="css">#block_container {
    text-align: center;
}

#bloc1, #bloc2 {
    display: inline;
}</code>

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>

Follow these guidelines to ensure proper alignment:

• Wrap the div blocks in a container div (#block_container) and set its text-align to center.
• Set the display property of the div blocks (#bloc1 and #bloc2) to inline to make them appear on the same line.
• For best practices, avoid placing raw content directly into div tags and instead use semantic tags like

  or for text.

By applying these styles, the two div blocks will align horizontally on the same line within their container.

The above is the detailed content of How do I align two Div blocks on the same line using CSS?. For more information, please follow other related articles on the PHP Chinese website!