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

      Advertisement

      Collapse

      Latest Topics

      Collapse

      • KitchWitch
        Comment on OSX Sierra
        KitchWitch
        Amen. I'm in an open layout and it's horrid. Even if your computer only recognized your voice (when I got my phone they had me say Hey Siri a billion times so my phone only responds when I speak to it),...
        Today, 12:07 PM
      • PanToshi
        Reply to OSX Sierra
        PanToshi
        Cubes? Who has cubes anymore? Most studios and agencies switched over to ''open plan'' office space yeaaars ago in my neck of the woods. I yearn for the flimsy 3 foot tall carpeted foam walls that...
        Today, 11:37 AM
      • designzombie
        Reply to Beauty in Graphic Design
        designzombie
        Beauty in graphic design is being paid in full on time with no revisions.
        Today, 11:31 AM
      • salsa
        Reply to Beauty in Graphic Design
        salsa
        Ah, but there is beauty in graphic design. Golden ratio, anyone? How many of us have used it to lay out a book cover or choose font sizes? Why do we avoid orphans and widows? Why do we chose colors that...
        Today, 11:30 AM
      • designzombie
        Reply to OSX Sierra
        designzombie
        Talking to your computer is fine if you're the only one in the building like some of the people who work from home. I can only see it in an office environment if you have sound proof cubes.
        ...
        Today, 11:27 AM

      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