CSS Positioning

Discussion in 'Web Design and Development' started by darkplanets, Nov 16, 2010.

  1. darkplanets macrumors 6502a

    Joined:
    Nov 6, 2009
    #1
    I've been looking around the Internet, and haven't been able to find a suitable solution to what I'd like to do in CSS; have an image (header) anchored to the top left, with a size that scales according to window size and/or simply users resolution. Instead of making multiple pages for multiple resolutions, I'd rather just have a self-scaling image. Is there any way to do this easily?
     
  2. Caleb531 macrumors 6502

    Caleb531

    Joined:
    Oct 17, 2009
    #2
    You might consider using a percentage, which is of the window itself (and the window is, to some degree, related to the screen resolution):

    Code:
    #logo {
    height: 30%
    }
    
    (you should only need to change either the width or the height; your image should stay proportional that way)
     
  3. admwright macrumors regular

    Joined:
    Sep 11, 2008
    Location:
    Scotland
    #3
  4. darkplanets thread starter macrumors 6502a

    Joined:
    Nov 6, 2009
    #4
    Awesome. That's exactly what I wanted. Now there's another question with relative positioning; say I have a box as a header, and a box offset it underneath (also placed via CSS)-- I tried using relative placement with percentages as the offset, but it doesn't scale the position correctly with the header at smaller resolutions. Is there any way I can in effect bind the top of the bottom header to the header offset by say 20% of the window size?
     

Share This Page