Forum PHP.pl > [CSS][HTML] div w divie

Pomoc - Szukaj - Użytkownicy - Kalendarz

Smoker

24.07.2010, 15:02:30

Witam mam problem z ustawieniem divów. Poniżej obrazek przedstawiający problem:

na samym dole niebieski DIV test tłem ogólnym powtarzającym się po osi x
na nim ustawiony jest DIV zielony - jest to logo - wyśrodkowane
czerwony DIV ma być nad zielonym i ma być zbiorem linków, odnośników i z nim mam problem, nie ma być wyśrodkowany a jedynie 50px od lewej krawędzi DIVa zielonego

jak go ustawic ?

[HTML] pobierz, plaintext 
<div id="top"> <!-- POCZĄTEK NIEBIESKIEGO DIVa -->
 <div id="top_logo"> <!-- POCZĄTEK ZIELONEGO DIVa -->
  <img src="obrazek.jpg" alt="">
 </div> <!-- KONIEC ZIELONEGO DIVa -->
</div> <!-- KONIEC NIEBIESKIEGO DIVa -->
[HTML] pobierz, plaintext

[CSS] pobierz, plaintext 
div#top {
 background: url(tlo.jpg) repeat-x scroll;
 width: 100%;
 height: 448px;
 z-index: 1;
}
div#top_logo {
 width: 1000px;
 height: 448px;
 z-index: 2;
}
[CSS] pobierz, plaintext

mrk9109

24.07.2010, 15:24:18

Kod

<body>
<div class="mrk">
          <div class="logo">
                      <div class="red"></div>
          </div>
</div>
</body>

style:

body { margin: 0 auto;  background-color: #000000; color: black; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; }
.mrk { margin: 0 auto; background-color: #FFFFFF; width: 800px; overflow: hidden; }
.logo { background-color: #CCCCCC; width: 800px; height: 300px; float: left; }
.red { background-color: #AAAAAA; width: 500px; height: 100px; float: left; padding-left: 150px; }

Kolory przykladowe wpisalem a jezeli chcesz miec bardziej na srodku czerwony to sobie go ustaw za pomoca paddingow

krzysztof_kf

24.07.2010, 15:33:04

To co przedstawiłeś na obrazku nie jest adekwatne do twojego zapytanie , problemu więc w czym jest problem .

.ekhm

[CSS] pobierz, plaintext 
<style type="text/css">
 
body {
background: #0000ff;
margin: 0px;
padding: 0px;
}
 
#top{
width: 800px;
height: 500px;
margin: 0 auto;
background: #00ff00;
}
 
#link {
width: 600px;
height: 100px;
margin: 0 0 0 50px;
background: #ff0000;
}
 
</style>
[CSS] pobierz, plaintext

i HTML

[HTML] pobierz, plaintext 
<div id="link">
   </div>
<div id="top">
   </div>
[HTML] pobierz, plaintext

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.