Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS How can I make margins collapsed if I floated the elements?

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #256877
    Ayala
    Participant

    https://codepen.io/Ayalann/pen/LLoJZO

    It seems if I don’t float the elements the margins collapse, but I need to float them left, because I want them in one line.

    But if there are margins they don’t collapse, therefore can’t be the three blocks in one line.

    How can I solve it?

    #256878
    Paulie_D
    Member

    Your widths aren’t logical since they don’t account for the margins.

    width:33% means 33% of ALL the parent width…not 33% of the remaining width.

    Accordingly, you have to account for the margins in your width calculations.

    Perhaps width: calc(33.33% - 2em);

    https://codepen.io/Paulie-D/pen/jwjBbj

    #256879
    Paulie_D
    Member

    Alternatively, use flexbox

    https://codepen.io/Paulie-D/pen/PjrpZd

    #256883
    Ayala
    Participant

    Thank you for your answer!

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘CSS’ is closed to new topics and replies.