div centered over img

Out of context: Reply #6

  • Started
  • Last post
  • 9 Responses
  • estetic0

    Wrap the image and text box in a relatively positioned left floated div.

    Position the text box absolutely with a set width and height. Top:50%, left:50% - with top and left margins half the height and width -

    .wrapper {
    position:relative;
    float:left;
    }

    p {
    position:absolute;
    top:50%;
    left:50%;
    width:100px;
    height:50px;
    margin: -25px 0 0 -50px;
    }

    • I find this to be the most reliable way to vertical centre, as long as you've got set height.Nathan_Adams
    • but margin: 0 auto works great for horizontal centre.Nathan_Adams

View thread