Announcement

Collapse
No announcement yet.

CSS Positioning Help

Collapse
X
  • Filter
  • Time
  • Show
Clear All
new posts

  • CSS Positioning Help

    I am currently trying to make a simple splash page, that involves 4 images (background/logo/english/french)

    Im currently trying to put the english/french on each side of the logo, and the logo centered in the middle. The problem is, when I resize the browser window, the images end up overlapping eatchother. Same as if I change my resolution.

    Here is the HTML/CSS:

    HTML Code:
    <body>
    <div id="container">
    
    <div id="sahel">
      <img src="spllogo.png"  alt="Spa Sahel Logo" />
    </div>
    <div id="english">
      <a href="eng.html" onMouseover="imageOn('english')" onMouseout="imageOff('english')"> <img src="english.png" name="english" border="0" /></a>
    </div>
    <div id="francais">
      <a href="fr.html" onMouseover="imageOn('francais')" onMouseout="imageOff('francais')"> <img src="francais.png" name="francais" border="0" /></a>
    </div>
    
    </div>
    
    </body>
    </html>
    Code:
    @charset "utf-8";
    /* CSS Document */
    html, body {
    	background-image: url(splbg.png);
    	border-style: none;
    	overflow: hidden
    }	
    #sahel{
    	position: relative;
    	top: 120px;
    	text-align: center;
    }
    #english {
    	position: absolute;
    	top: 274px;
    	left: 200px;
    }
    #francais {
    	position: absolute;
    	top: 274px;
    	right: 200px;
    }
    
    #container {
    	min-width: 100%;
    	width: 100%;
    	position: relative;
    }
    I would just like to make everything stay in place, rather than overlapping when the window is resized.

    and how would I optimize this for smaller resolutions? (I am viewing this at 1600x900)

    Thanks

  • #2
    What is the point of the container div? If you want to control the width, set a width on it.
    Swedish Meatball Pornography

    Comment


    • #3
      I put it in as a last ditch effort. It wasn't working before I put that in anyways.

      Comment

      Search

      Collapse

      Sponsor

      Collapse

      Incredible Stock

      Latest Topics

      Collapse

      • Pavlo
        Reply to Graphic Designer needs a Camera
        Pavlo
        I think the limiting factor here will not be the camera – it will be your photographic knowledge, lighting and studio experience as well as image processing and retouching skills using software such...
        Yesterday, 11:00 PM
      • Nierste86
        Reply to Identity crisis with my personal identity?!
        Nierste86
        As so many have already iterated, the first two could be mistake for a woman's chest. If you want them to look more like teeth maybe draw them as a molar tooth to read as teeh. As far as your current...
        Yesterday, 10:06 PM
      • Nierste86
        Reply to Personal rebranding: feedback please
        Nierste86
        Still trying to get the hang of this forums formatting
        ...
        Yesterday, 08:50 PM
      • Kayekaye
        Reply to Dream jobs?
        Kayekaye
        Designing surfboards on Waikiki beach. Course I wouldn't make enough money to be able to actually live there...
        Yesterday, 08:18 PM
      • Kayekaye
        Reply to Trouble brewing in freelance land?
        Kayekaye
        Well so it goes. Been there done that. Had one client that told me he wanted to pay me to teach his 18 year old "artsy" son to do all my work. Left him high and dry. Another situation I worked...
        Yesterday, 08:00 PM
      GDF A division of Mediabistro Holdings Adweek | Mediabistro | Clio | Film Expo Group Contact Us | Terms of Use | Privacy Policy Copyright 2016 Mediabistro Holdings
      Working...
      X