Home/ Questions/Q 280757
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-12T05:08:45+00:00

I’d like to have ‘b’ be equally distributed along ‘a’ like this : [1

  • 0

I’d like to have ‘b’ be equally distributed along ‘a’ like this :

[1        2         3        4]

It would be nice that if there is not enough space, then ‘a’ block extends to the next line. Here is the html structure, I’d like, but its not fixed in stone and can be modified.

<html>
    <head>
        <style>
            .a { width: 100%; border: 1px solid; float: left; }
            .b {  width: 100px; border: 1px solid red; float: left;}
        </style>
    </head>
    <body>
        <div class'a'>
            <div class='b'>1</div>
            <div class='b'>2</div>
            <div class='b'>3</div>
            <div class='b'>4</div>
        </div>
    </body>
</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Am correct in thinking you want to achieve this:

    [[1   ][ 2  ][  3 ][   4]]

    to essentially give this (with the ‘b’ borders hidden):

    [1    2    3    4]

    but where you have an arbitrary number of fixed-width inner items, and the outer container is of arbitrary width?

    I’m not really sure there’s a way of achieving that without delving into javascript 🙁

    • 0