[Resolvido] Imagem de borda do template com problema

  • hutred
  • Avatar de hutred Autor do Tópico
  • Offline
  • JCB! Estagiário
  • JCB! Estagiário
Mais
14 anos 10 meses atrás #41222 por hutred
hutred created the topic: [Resolvido] Imagem de borda do template com problema
Olá pessoal,

Estou criando um template onde contém borda na direita e esquerda do template com imagem que se repetirá até o fim do conteúdo (fim da página).

Acontece que para que a imagem apareça eu tenho que colocar a função "height", mas com o "auto" não aparece a imagem, para aparecer eu tenho q por 100%, mas essa função só reconhece a altura da página que aparece no momento, e não da página completa.

Meu index está assim:
<body>
&#91;b&#93;    <div id="marginl"></div>
    <div id="marginr"></div>&#91;/b&#93;
        <div id="header">
        </div>
        <div id="menu">
                    <jdoc:include type="modules" name="menu" style="none" />
        </div>
        <div id="content">  
            <div id="colleft">
                       <jdoc:include type="component" />
            </div>
            <div id="colright">
              <?php if($this->countModules('right')) : ?>
              <jdoc:include type="modules" name="right" style="xhtml" />
              <?php endif; ?>
            </div>
        </div>
</body>

E o Css do body e das colunas laterais são:
body{
	width: 900px;
	margin: 0 auto;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 0.8em;
	color: #666;
	background-color:#fff;
	}

#marginl {
	position: absolute;
	background: #fff url(../images/sombra_esquerda.gif) scroll;
	height: 100%;
	width: 80px;
	margin: 0;
	float: left;
	clear: both;
	}

#marginr {
	position: absolute;
	background: #fff url(../images/sombra_direita.gif) top right repeat-y;
	height: 100%;
	width: 80px;
	margin: 0 0 0 820px;
	float: right;
	}

Será que dá pra resolver?

Obrogado até o momento.

[b:2g3khrer][center:2g3khrer][url:2g3khrer]http://www.cacadoresdecachoeiras.com.br[/url:2g3khrer]
[url:2g3khrer]http://www.trilhaalternativa.com.br[/url:2g3khrer]
[url:2g3khrer]http://www.expedicaori.com.br[/url:2g3khrer]
[url:2g3khrer]http://www.joarleyrodrigues.com.br[/url:2g3khrer][/center:2g3khrer][/b:2g3khrer]

Please Entrar ou Registrar to join the conversation.


  • hutred
  • Avatar de hutred Autor do Tópico
  • Offline
  • JCB! Estagiário
  • JCB! Estagiário
Mais
14 anos 10 meses atrás #41239 por hutred
hutred replied the topic: Re: Imagem de borda do template não vai até o final da página
Olá pessoal..

Futuquei, futuquei até conseguir...
Tive que declarar 2 vezes cada uma das sobras (direita e esquerda)

Ficou assim o index:
<body>
	
<div id="marginl">
	    <div id="marginr">
			<div id="header">
                        </div>
	                <div id="menu">
	        	       <jdoc:include type="modules" name="menu" style="none" />
	                </div>

	                <div id="content">
	        	<div id="colleft">
	       		       <jdoc:include type="component" />
	                </div>
	                <div id="colright">
                        </div>
	                </div>
	    </div>
</div>
</body>

E o Css
body{
	height: 100%; 
	position: relative;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 0.8em;
	color: #666;
	background-color:#fff;
	text-align: center;
	}

#marginl
{ width: 816px; padding: 0 0 0 80px; margin: 0 auto; text-align: left; font-size: 1em; 
line-height: 150%; background: url(../images/sombra_esquerda.gif) left top repeat-y; }

	#marginr
	{ padding: 0 3px 0 0; background: #fff url(../images/sombra_direita.gif) right top repeat-y; }

#content {
			background: url(../images/sombra_direita.gif) right top repeat-y;
			position: absolute;
			width: 736px;
			margin: 0px 0 0 0;
			padding: 0 80px 0 0;
			}
				
				#colleft {
					background: url(../images/sombra_esquerda.gif) left top repeat-y;
					width: 476px;
					margin: 0 0 0 -80px;
					float: left;
					font-family: Arial, Helvetica, sans-serif;
					font-size: 1em;
					padding: 20px 0 0 80px;
							}
					
				#colright {
					background: #DDE6EF;
					color: #597FBF; 
					width: 220px;
					float: right;
					margin: 20px 0 0 0;
					padding: 0px 10px 10px 10px ;
					}

[b:2g3khrer][center:2g3khrer][url:2g3khrer]http://www.cacadoresdecachoeiras.com.br[/url:2g3khrer]
[url:2g3khrer]http://www.trilhaalternativa.com.br[/url:2g3khrer]
[url:2g3khrer]http://www.expedicaori.com.br[/url:2g3khrer]
[url:2g3khrer]http://www.joarleyrodrigues.com.br[/url:2g3khrer][/center:2g3khrer][/b:2g3khrer]

Please Entrar ou Registrar to join the conversation.