How to Align Div Blocks on the Same Horizontal Line?

Aligning Div Blocks on the Same Horizontal Line

When attempting to align two div blocks on the same line, HTML and CSS can be used to achieve this layout.

To align the div blocks horizontally, create a container div with the ID "block_container." Within the CSS, specify the following properties for this container div:

#block_container {
    text-align: center;
}

This will center all elements inside the "block_container" div.

For the two div blocks, assign them unique IDs such as "bloc1" and "bloc2." In the CSS, use the following properties:

#bloc1, #bloc2 {
    display: inline;
}

By setting the display to inline, the div blocks will be placed beside each other horizontally.

Example 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>

Note that it's recommended to use proper semantic tags for content, such as

or , instead of placing raw content directly into div elements.

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