Announcement

Collapse

Critical Announcement

With great regret, we would like to inform you that the decision has been made to close down www.GraphicDesignForum.com as of January 31, 2018.

The community has started www.GraphicDesignForum.org to continue the discussion.
See more
See less

CSS Positioning Help

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

  • Flip ツ
    started a topic CSS Positioning Help

    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

  • Flip ツ
    replied
    I put it in as a last ditch effort. It wasn't working before I put that in anyways.

    Leave a comment:


  • vanishdesign
    replied
    What is the point of the container div? If you want to control the width, set a width on it.

    Leave a comment:

Search

Collapse

Sponsor

Collapse

Latest Topics

Collapse

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