Warstwy w css Opcje

[urbizdw]

[HTML] pobierz, plaintext 
body{
  background-color:#FFFFFF;
}
.srodek{
  margin: 0 auto; 
  text-align: center;
}
.logo{
  width: 785px; 
  height: 289px; 
  background: url('logo.png') no-repeat; 
  background-position: top center;
  margin: 0 auto;
  text-align:center;
  z-index:1;
}
.internet{
  background-image:url(internet.png);
  width:45px;
  height:122px;
  margin-left:500px;
  z-index:0;
}
[HTML] pobierz, plaintext 

[HTML] pobierz, plaintext 
<div class="srodek"> 
   <div class="logo">
     <div class="internet"></div> 
   </div>
</div>
[HTML] pobierz, plaintext 

Tak wyglada

A jak przerobic by przycisk byl pod logiem? Prosze o odpowiedz

[osl]

tak na szybko
ustaw pozycje .srodek i .logo relatywnie,
internet absolutnie z topem na 0
a diva internet wyciągnij z logo i wstaw do srodek
pozostanie Ci jeszcze kwestia ustawienia w poziomie...

pytanie jak się IE zachowa - nie mam takowego na podorędziu więc nie sprawdze....

Ten post edytował osl 17.04.2009, 12:54:29

[urbizdw]

tylko jak dam absolutnie to jak ustawic teraz wzgledem srodka? bo gdy bedzie inna rozdzielczosc to wtedy beda klopoty. Da sie moze jakos za pomoca z-index? prosze o podpowiedz i pomoc

Ten post edytował urbizdw 17.04.2009, 13:00:03

[osl]

inaczej jeszcze:

do diva logo wrzuć jeszcze jednego diva logo, zewnętrznemu wyłącz tło i wrzuć do niego internet
klasie logo dodaj pozycje relatywną, internetowi absolutną. i teraz pozycjonujesz internet dokładnie tak jak wcześniej, np. margin-left

Tyle że tego w IE nie jestem już w ogóle w stanie przewidzieć

[urbizdw]

Prosze zobaczcie czy kod css jest dobrze napisany i jak rozwiazac ten problem z guzikami zeby byly pod logiem. Prosze powiedzie mi co musze zrobic by bylo ok
To jest jak wyglada narazie

[pawkow]

div.menu_top wypozycjonuj absolutnie po prostu, o ile dobrze zrozumiałem Twój problem nie będzie z tym większych problemów. Nadaj div.logo position relative a div.menu_top absolute i sie baw.

Ewentualnie, jest fajny myk na pozycjonowanie divów z absolute na środku ekranu - ujemne marginesy.

Jeżeli znasz width elementu dajesz mu left: 50% i margin-left: -1/2width_elementu

dla przykładu:
width: 600px;
left: 50%;
margin-left: -300px;

oczywiście position: absolute;

Ten post edytował pawkow 27.04.2009, 13:56:45