Search code examples
csshtmlalignmentpositioning

Center element with left aligned element inline within container

I have two <div> elements inside a container <div> and I need to align one of them on the left of the container, and the other in the center of the container while keeping them inline.

If I just float the first one left, the second one gets pushed off-center to the right.

Right now my best solution is to make the container position: relative with text-align: center and align the first element to left with position: absolute.

Perhaps there is an alternative, better way to do this, without going for absolute positions?

Solution

  • This is a really long shot, but i've found that applying a big negative margin-right on the left floated element will compensate on the center-offset...

    try giving the floated div a margin-right: -1000px;