Announcement Announcement Module
Collapse
No announcement yet.
CSS Positioning Help Page Title Module
Move Remove Collapse
Search Search Module
Collapse

Advertisement Advertisement Module
Collapse

Featured Images Featured Images Module
Collapse

Mediabistro Creative Sites Mediabistro Creative Sites Module
Collapse
Latest Topics Latest Topics Module
Collapse

  • ISitude
    Reply to Law Firm Logo
    ISitude
    I agree with the overall comments of the ampy and LLC being too stressed and the whole deal being centrally columnized....yes, columnized is not new word.
    Today, 04:51 AM
  • ISitude
    Reply to Working on a logo for myself
    ISitude
    Love the idea, I'm struggling with the execution.

    To me the beast should be a clear forceful/powerful movement of rising up. In your rendition it seems that this is much less so ...no power...
    Today, 04:39 AM
  • B
    Reply to Unused designs - who owns them?
    B
    You don't feel an obligation to turn them over and wouldn't without a fee. So far I'm with you, but then you say that you feel as though you can't use them because they were part of the process of creating...
    Today, 03:09 AM
  • B
    Reply to My Stonework company logo
    B
    Howdy Begeebuz. Welcome to the forum.

    Here are links to the forum rules and some useful information.We screen for spammers, so the first few posts...
    Today, 02:55 AM
  • EmberMike
    Reply to Unused designs - who owns them?
    EmberMike
    I don't think I'd ever feel obligated. And if requested I wouldn't hand them over for free. I've looked at it more as being a part of the final product. Even though I'm not handing over the sketches,...
    Today, 02:45 AM
Advertisement Advertisement Module
Collapse

Sponsors Sponsors Module
Collapse

X
Conversation Detail Module
Collapse
  • 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

      Mediabistro A division of Prometheus Global Media home | site map | advertising/sponsorships | careers | contact us | help courses | browse jobs | freelancers | content | member benefits | reprints & permissions terms of use | privacy policy Copyright © 2014 Mediabistro Inc.
      Working...
      X