Home/ Questions/Q 651743
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-13T22:11:44+00:00

Suppose I have an HTML page with three blocks of fixed width (their height

  • 0

Suppose I have an HTML page with three blocks of fixed width (their height can vary if that’s important), like shown on picture:
alt text

I would like to make it behave as shown on next picture: when browser screen width is reduced so it can’t fit all three blocks in one line, first block goes down.
alt text

Is it possible to achieve such behavior? Preferably with CSS only but any working solution would be great.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team
    <div style="width: 100%;">
    <div style="display: inline-block; background-color: red; width: 200px;">DIV2</div>
    <div style="display: inline-block; background-color: yellow; width: 200px;">DIV3</div>
    <div style="display: inline-block; float: left; background-color: lightBlue; width: 200px;">DIV1</div>
    <br style="clear: left;">
</div>

    This one works. You put block 1 as the last one and only make that one float left.

    • 0