Acelarado
20-05-2006, 17:27
boas,
a minha duvida é a seguinte, como consigo criar algo do genero como isto: http://e107.org/news.php
refiro-me a a parte do layout, tipo posso aumentar ou diminuir o tamanho da janela que o banner por exemplo ajusta-se automaticamente.
eu não sei por que termos procurar no google em msm explicar-me bem... :(
se alguem me indicar uns tutorials ou dar umas dicas...
eu uso divs e css para trabalhar, agora ando a tentar fazer algo do genero como aquilo mas n estou msm a conseguir.
Hey!
Não sei se já deste uma vista de olhos pelo código mas é simples.
Ele tem um div "header" com um "headerr" lá dentro:
<div id="header">(...)<div id="headerr"> </div></div>
O ' ' é um caracter para aparecer um espaço, para ter a certeza que o div contém alguma coisa.
No 'header' tem uma imagem a repetir-se no eixo dos x e no 'headerr' tem este fim (http://e107.org/e107_themes/evil9/images/logo4.png) de header.
O truque aqui é colocar o div 'headerr' (neste caso) dentro do outro e dar-lhe um posicionamento absoluto, o que permite que definas onde ele se coloca - neste caso a 10px do topo e também a 10px da direita.
Em CSS isto seria:
position: absolute;
top:10px;
right:10px;
Acelarado
20-05-2006, 17:55
eu vi codigo da pagina e tenho uma div dentro da outra tb
o problema deve ser que n tenho em absolute
bem vou tentar a se consigo alguma cena
obrigado :)
Tens mesmo que ter em absolute, os valores de posicionamento bem e vê tens o tal espaço = ' '
;)
Acelarado
20-05-2006, 18:12
<div id="banner"><div id="end"> </div></div>
#banner {
height: 130px;
background-repeat: no-repeat;
background-image: url(../images/index_01.jpg);
}
#end {
background-image: url(../images/index_03.jpg);
position: absolute;
}
não me esta dar o fim desaparece, fica no prencipio mas nem aparece...
e depois eu tenho que ter algo a repetir uma parte da imagem n?
Era mais fácil se desse para dar uma olhadela na página, mas pelo que estou a ver faltam aí os valores do posicionamento do #end.
top e right, se for como o caso que mostraste.
Acelarado
20-05-2006, 18:28
ok ja percebi e ja esta a funcionar
codigo html:
<div id="banner"><div id="end"> </div></div>
codigo css:
#banner {
height: 130px;
background-repeat: repeat-x;
background-image: url(../images/index_01.jpg);
}
#end {
height: 130px;
background-image: url(../images/index_03.jpg);
position: absolute;
right: 5px;
width: 32px;
}
obrigado pela ajuda ;)