Forums

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

Home Forums CSS Vertical and horizontal centered

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

    Hi,

    I want to take the yellow div in center vertically and horizontally as well, related to the container.

    The 50vh height is important for the container.

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

    (The floated element should stay where it is.)

    Could you help me?

    #259816
    Paulie_D
    Moderator

    There is only one way that I know off (excluding JS) which is to absolutely position the item to be centered.

    Otherwise, the floated element will be taken into account when laying out the elements and affect the centering methods that might otherwise be used.

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

    #259817
    Paulie_D
    Moderator

    You can sort of fake it with Flexbox if you know the size of the floated item by adding a pseudo-element but I wouldn’t recommend this:

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

    #259819
    Ayala
    Participant

    Thank you!

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