How to Align Two Div Blocks on the Same Line with CSS?

Aligning Two Div Blocks on the Same Line

In order to align two div blocks on the same horizontal line, we can utilize CSS and the display property. Here's how you can achieve this:

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>

By setting the text-align of the container div to center and the display of the child divs to inline, we ensure that the elements flow horizontally within their container and are centered accordingly.

Additional Notes

It's recommended to avoid placing raw content directly into div elements. Instead, use appropriate HTML tags like

or to provide semantic meaning to your content.

The above is the detailed content of How to Align Two Div Blocks on the Same Line with CSS?. For more information, please follow other related articles on the PHP Chinese website!