SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Member
    Join Date
    Oct 2009
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Positioning a navigation graphic without negative margins

    I have a navigation graphic with an image map that covers part of my page, like so:



    The CSS for this graphic is as follows:

    Code:
    #nav {
    	position: absolute;
    	width: 439px;
    	height: 385px;
    	left: 500%;
    	margin-left: -680px;
    	margin-top: -127px;
    	z-index: 5;
    }
    I decided to do this because the rest of the page is centred. The problem with this is that once the browser window becomes narrow enough, the graphic starts shifting over to the left, out of view, in no way accessible. What other methods can I use to position this graphic?

  2. #2
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,719
    Mentioned
    7 Post(s)
    Tagged
    0 Thread(s)
    If you give a near parent position:relative, you can lower the values of the absolute position element and thus it won't shift out of the way

    If you post a link to where this is at I can give you an exact code answer
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  3. #3
    SitePoint Member
    Join Date
    Oct 2009
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That worked perfectly. Thank you very much!

  4. #4
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,719
    Mentioned
    7 Post(s)
    Tagged
    0 Thread(s)
    You're welcome .
    Always looking for web design/development work.
    http://www.CodeFundamentals.com


Bookmarks

Posting Permissions

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