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 6 of 6
  1. #1
    Regular Coder
    Join Date
    Aug 2004
    Location
    The Netherlands
    Posts
    211
    Thanks
    0
    Thanked 1 Time in 1 Post

    Positioning help needed

    http://www.jero.net/template.html

    I want to have the hover images of the top menu to stay at the place they currently are, but on all resolution. It only works on 1024x768 at the moment. Any help would be greatly appreciated.

  • #2
    Master Coder
    Join Date
    Apr 2003
    Location
    in my house
    Posts
    5,211
    Thanks
    39
    Thanked 201 Times in 197 Posts
    Code:
    #menu a:hover img {
    	position: absolute;
    	top: 0px;
    	right: 206px;
    	width: 120px;
    	height: 100px;
    }
    
    #menu a:hover>img {
    	right: 217px;
    }
    I dont understand the two of these are in your stylesheet. It seems like it's a duplication of a sort, though I could be wrong.

    Anyway, I think the position:absolute is the difficulty with the positioning of the images. perhaps removing that attribute and making the image float right? Cant be sure it'll work but thats what I would try firstly.

    hth
    bazz
    "The day you stop learning is the day you become obsolete"! - my late Dad.

    Why do some people say "I don't know for sure"? If they don't know for sure then, they don't know!
    Useful MySQL resource
    Useful MySQL link

  • #3
    Senior Coder
    Join Date
    Jun 2002
    Location
    The Netherlands, Baarn, Ut.
    Posts
    4,252
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Positioning

    Bazz,
    I dont understand the two of these are in your stylesheet.
    I think that's a CSS hack to serve more compliant browsers -ones that understand the child selector- the correct value for "right".

    Jero,

    First of all, what is going wrong? I reduced my window width to your layout's width (from max. on 1024x768) and everything stayed in place perfectly (oh, using IE6.0/win2000 here).

    To be certain, you could position the images in relation to the "top" div; at least, that one has constant dimensions. give it a position: relative and it should function as a positioning parent for your images.
    Regards,
    Ronald.
    ronaldvanderwijden.com

  • #4
    Master Coder
    Join Date
    Apr 2003
    Location
    in my house
    Posts
    5,211
    Thanks
    39
    Thanked 201 Times in 197 Posts
    ronald66, Thanks for that.

    As for the problem, it doesn't seem to show itself in 1024 no matter what size the window. If set to 800x600 the images however, are more to the left - about I reckon, 200px; The only reason I can think for this is that, positioned absolutely, fixes the place of the rollovers in the window. As we change the res to 800x600, that distance shows itself to be bigger because 200 px is a higher % of 800 than it is of 1024 ensuring that the gap looks wider. Add to this the fact that 200 px looks bigger in 800 than in 1024 and the bigger gap might be explained fully.

    My suggestion, is to use percentages and to bin absolute. Use relative positioning or leave out the positioning element altogether.

    hth Bazz
    "The day you stop learning is the day you become obsolete"! - my late Dad.

    Why do some people say "I don't know for sure"? If they don't know for sure then, they don't know!
    Useful MySQL resource
    Useful MySQL link

  • #5
    Senior Coder
    Join Date
    Nov 2003
    Location
    Minneapolis, MN
    Posts
    2,879
    Thanks
    2
    Thanked 65 Times in 56 Posts


    I just tried it on 800x600 and it's fine. A pixel is a pixel is a pixel, I don't see why absolute positioning wouldn't work (as it seems to be).

    Percentages would be the wrong way to go here... I mean, if the wrapper were 800px wide, and the image was 25px from the right, why would that change at different resolutions?

  • #6
    Master Coder
    Join Date
    Apr 2003
    Location
    in my house
    Posts
    5,211
    Thanks
    39
    Thanked 201 Times in 197 Posts
    Yeh, I have just tried it agian and it is fine today so it seems Jero got a fix and hasn't let told us how.

    I notice though, that he/she changed the positioning from absolute as I suggested Perhaps a coincidence that it is now working? Hmmmm


    Bazz
    "The day you stop learning is the day you become obsolete"! - my late Dad.

    Why do some people say "I don't know for sure"? If they don't know for sure then, they don't know!
    Useful MySQL resource
    Useful MySQL link


  •  

    Posting Permissions

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