Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Aug 2005
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Mysterious blank space

    Hi

    I'm developing a webpage and facing an annoying problem. I used a layer to center the content of my page and inside it I've added other layers with relative positioning. However, a mysterious blank space was created in the bottom of my page and nothing I do can make it disappear.

    CSS code
    body {
    margin:0;
    padding:0;
    text-align:center;
    background-image: url(images/bg.gif);
    }
    #tudo {
    width: 780px;
    height: 10px;
    margin:0 auto;
    margin-bottom: 0px;
    padding: 0px;
    text-align:left;
    border: 1px solid #ff0000;
    background-color: #ccc;
    }
    #flash {
    float:left;
    position:relative;
    left:0px;
    top:-55px;
    width:740px;
    height: 277px;
    border: 1px solid #ff0000;
    z-index:20;
    }
    #flash2 {
    float:left;
    position:relative;
    left:0px;
    top:-230px;
    width:740px;
    height: 450px;
    z-index:0;
    background-color: #aad9fd;
    border: 1px solid #ff0000;
    }
    #wleft {
    float:left;
    position:relative;
    left:0px;
    top:0;
    width: 10px;
    height:542px;
    z-index:25;
    background-color: #fff;
    border: 1px solid #ff0000;
    }
    #wright {
    float:left;
    position:relative;
    left:510px;
    top:-777px;
    width: 10px;
    height:542px;
    z-index:25;
    background-color: #fff;
    border: 1px solid #ff0000;
    }
    #wbottom {
    float:left;
    position:relative;
    left:-10px;
    top:538px;
    width: 760px;
    height: 10px;
    z-index:23;
    padding:0;
    margin: 0;
    z-index:25;
    border: 1px solid #ff0000;
    }
    #politicas {
    float:left;
    font-size: 9px;
    font-family: Tahoma;
    position:relative;
    left:-10px;
    top:530px;
    width:760px;
    height:35px;
    z-index:25;
    background-color: #fff;
    layer-background-color: #fff;
    padding: 3px 0px;
    color: #CCC;
    text-align: center;
    margin: 0px;
    border: 1px solid #ff0000;
    }
    #bg1 {
    float:left;
    position:relative;
    left:7px;
    top:-510px;
    width: 262px
    height:298px;
    z-index:21;
    background-image: url(images/interna_left.gif);
    background-repeat: no-repeat;
    layer-background-image: url(images/interna_left.gif);
    border: 1px solid #ff0000;
    }
    #bg2 {
    float:left;
    position:relative;
    top:-502px;
    left:180px;
    width: 328px;
    height:264px;
    z-index:18;
    background-image: url(images/interna_bg.jpg);
    background-repeat: no-repeat;
    layer-background-image: url(images/interna_bg.jpg);
    border: 1px solid #ff0000;
    }
    #menu1 {
    float:left;
    position:relative;
    top:-20px;
    left:20px;
    width: 240px;
    height:270px;
    z-index:2;
    border: 1px solid #ff0000;
    }
    #menu2 {
    float:left;
    position:absolute;
    top:112px;
    left:0px;
    width: 240px;
    height:158px;
    z-index:2;
    border: 1px solid #ff0000;
    }
    #texto {
    float:left;
    position:relative;
    top:-890px;
    left:40px;
    width: 420px;
    height:270px;
    z-index:19;
    font-family: Arial, sans-serif;
    font-size: 13px;
    color: #000;
    padding: 0;
    margin: 0;
    border: 1px solid #ff0000;
    }
    a,a:visited {
    text-decoration:none;
    color: #616D77;
    }
    a:hover {
    text-decoration:underline;
    }
    a.politicas,a.politicas:visited {
    padding: 5px;
    font-size: 11px;
    font-family: Tahoma;
    color: #999;
    text-decoration:none;
    font-variant: small-caps;
    }
    a.politicas:hover,a.politicas:visited:hover {
    text-decoration:underline;
    }
    HTML code
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>ECOFOR - interna</title>
    <link href="estilo.css" rel="stylesheet" type="text/css">
    </head>
    <body bgcolor="#aad9fd" topmargin="0" leftmargin="0">
    <div id="tudo" align="center">
    <div id="wleft"></div>
    <div id="wbottom"><img src="images/pix.gif" width="760" height="10"></div>
    <div id="politicas" style="background-color:#fff">
    <div style="padding-bottom: 10px; display: inline; position: relative; z-index: 30px;"><a href="privacidade.htm" class="politicas">Política
    de Privacidade</a> | <a href="seguranca.htm" class="politicas">Política
    de Segurança</a></div>
    <div style="color: #333; padding-top: 3px;">Copyright © 2005 Grupo Marquise
    - Todos os direitos reservados.</div>
    </div>
    <div id="flash">
    <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="740" height="277" id="ecofor_interna_menu" align="middle">
    <param name="allowScriptAccess" value="sameDomain" />
    <param name="movie" value="ecofor_interna_menu.swf" />
    <param name="quality" value="high" />
    <param name="wmode" value="transparent" />
    <param name="bgcolor" value="#aad9fd" />
    <embed src="ecofor_interna_menu.swf" quality="high" wmode="transparent" bgcolor="#aad9fd" width="740" height="277" name="ecofor_interna_menu" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
    </object>
    </div>
    <div id="flash2"></div>
    <div id="bg1">
    <div id="menu1"> <a href="#"><img src="images/item_apre-on.gif" height="13" border="0" vspace="2"></a><br>
    <a href="#"><img src="images/item_qual-off.gif" height="13" border="0" vspace="2"></a><br>
    <a href="#"><img src="images/item_tecn-off.gif" height="13" border="0" vspace="2"></a>
    </div>
    <div id="menu2">
    <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="214" height="159" id="ecofor_interna_bot" align="middle">
    <param name="allowScriptAccess" value="sameDomain" />
    <param name="movie" value="ecofor_interna_bot.swf" />
    <param name="quality" value="high" />
    <param name="wmode" value="transparent" />
    <param name="bgcolor" value="#aad9fd" />
    <embed src="ecofor_interna_bot.swf" quality="high" wmode="transparent" bgcolor="#aad9fd" width="214" height="159" name="ecofor_interna_bot" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
    </object>
    </div>
    </div>
    <div id="wright"></div>
    <div id="bg2"></div>
    <div id="texto"> <a href="caos.html">Home</a> > <a href="#">Quem somos</a>
    <p><img src="images/titulo_apre.gif" border="0">
    <p>Públicos são pessoas que se relacionam com a empresa (portanto potenciais
    usuários do site) e possuem características e necessidades diferentes. Por
    exemplo: um hotel possui entre seus diversos públicos o turista nacional,
    o turista estrangeiro, o empresário que realiza eventos e os participantes
    destes eventos.</p>
    <p>Tendo como base esta definição, gostaríamos que fossem levantados quais
    os cinco principais públicos que se relacionam com a empresa. Faça uma breve
    descrição e distribua 100 pontos entre eles considerando sua importância
    para a empresa. </p>
    <p>Tendo como base esta definição, gostaríamos que fossem levantados quais
    os cinco principais públicos que se relacionam com a empresa.</p></div>
    </div>
    </body>
    </html>
    Can someone help me?

    tks

  • #2
    Senior Coder
    Join Date
    Jul 2004
    Location
    New Zealand
    Posts
    1,315
    Thanks
    0
    Thanked 2 Times in 2 Posts
    Your code is a mess. It would be easier to fix if you could give me a link.
    Forget style. Code to semantics. Seperate style from structure, and structure from behaviour.
    I code to specs, and test only in Firefox (unless stated otherwise).


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •