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

      • Biggs097
        Reply to Cards and Invitations
        Biggs097
        You'll also never find a desktop printer that will print on the weight of paper necessary for invites and cards. The lowest weight that customers would appreciate would be around 100# cover and even then...
        Today, 09:35 AM
      • PrintDriver
        Reply to Immigrating / Temporary Work as Designer in Toronto, CA
        PrintDriver
        The first thing, are you moving there as a temporary resident or applying for citizenship?
        The second thing, look into info on what it takes to obtain a work permit or visa to see if you meet the...
        Today, 08:44 AM
      • PrintDriver
        Reply to Cards and Invitations
        PrintDriver
        Ink/toner are the contributing factors toward the failure of going it on your own. Inkjet inks run in the rain (if the mailed piece just happens to get wet.) Desktop laser toners don't particularly like...
        Today, 08:40 AM
      • B
        Reply to Question about client opting out suddenly
        B
        A few years ago, I had the opportunity to work quite closely with a well-known designer one whose work most everyone would recognize.

        During that time, I learned a good deal from him. Most...
        Today, 08:03 AM
      • SigmaTT
        Reply to Cards and Invitations
        SigmaTT
        Relatively speaking,
        I've saved more from having a company take care of the printing. Ink/toner alone can cost quite a bit....
        Today, 07:44 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