Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    Regular Coder
    Join Date
    Nov 2010
    Posts
    295
    Thanks
    105
    Thanked 0 Times in 0 Posts

    How to position an image ANYWHERE on a page?

    Let me start anew thread for this issue guys. I understand now about "box" positioning, what I'd like to know now is how to position an image anywhere I feel like on a page? For example, I don't want "top right" or "bottom left" e.t.c, I want to be able to place an image anywhere? So let's say I have a header and I want to position an image at an exact spot within that header how can do so?

  • #2
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,930
    Thanks
    6
    Thanked 1,041 Times in 1,014 Posts
    You’d use absolute positioning on the image. Note that the position of an absolutely positioned element is relative to the bounding box of the next relative, absolute, or fixed positioned parent element. If none applies, then the viewport is the bounding box.

    So, if you have a header with an image inside you’d apply position: relative to the header and position: absolute to the image. You can then position it with the left/right/top/bottom CSS properties.

  • #3
    New Coder
    Join Date
    Dec 2010
    Posts
    13
    Thanks
    0
    Thanked 1 Time in 1 Post
    It must looks like this:
    Code:
    div#header {
    position: relative;
    }
    
    img#headimg {
    position: absolute;
    left: whatever you like
    top: whatever you like
    }


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •