Div Opcje

[kapral]

W jaki sposób mogę umieścić odok siebie dwa div'y,
Pierwszy aby miał wymiary 150 x 30 px,
a drugi 10 x 30px

[mike]

[HTML] pobierz, plaintext 
<style>
#container {
    width: 164px;
    border: #f00 solid 1px;
    overflow: auto;
}
 
#one {
    float: left;
    width: 150px;
    height: 30px;
    border: #0f0 solid 1px;
}
 
#two {
    float: right;
    width: 10px;
    height: 30px;
    border: #00f solid 1px;
}
</style>
 
<div id="container">
  <div id="one"></div>
  <div id="two"></div>
</div>
[HTML] pobierz, plaintext 

[kapral]

A w jaki sposób mogę teraz w tego div'a:

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

wstawić tekst który bedzie zawsze na środku w pionie

[mike]

Teoretycznie wystarczyłoby użyć vertical-align, ale ...
Aby wyśrodkować coś w pionie w elemencie blokowym trzeba użyć kombinacji vertical-align i line-height.

Line height calculations: the 'line-height' and 'vertical-align' properties

Dowiesz się szukając w tym kierunku.

[revyag]

Ostatnio natknąłem się na inny sposób:

Kod

#one {
    font: normal rozmiar_czcionki/wysokosc_diva Verdana, Tahoma, sans-serif;
    text-align:center;
}

np.

Kod

font: normal 10px/30px Verdana, Tahoma, sans-serif;

Ten post edytował revyag 8.12.2005, 13:05:36

[kapral]

Ponieważja robie menu i nie wiem czy zrobić w tabelkach rozmieszczenie elementów - wtedy nie ma najmniejszego problemu, czy przejść na tak zalecane div'y, ale poszukam w tym linku

[mike]

... menu ... tabelki ... :?:

Przejdź na listy, czyli na to, w czym powinno być zrobione menu.
A listę daj do diva i masz wszystko czego chcesz

Zerknij tutaj:
css.maxdesign.com.au

[kapral]

Listy to nie wiem czy mogę użyć poniewać za linkiem w menu mam obrazki które zmieniają kolor po najechaniu i używając list to raczej by nie wyszło
do mike_mech bo meny muszę mieć tak jak podawałeś mi z tymi div'ami czyli w pierwszym mam tekst a w drugim obrazek który sie zmienia po najechaniu

Ten post edytował kapral 8.12.2005, 13:21:16

[mike]

Przypomniał mi się Twój wątek jak to znalazłem: whatever:hover.
Może Ci się przyda.