Dla webmastera > Kodowanie

Tytuł postu na ikonie wpisu

(1/2) > >>

Drew:
Otwórz mam taki mały problem. Nie wychodzi mi zakodowanie tytułu postu na ikonie wpisu. Są momenty kiedy ten tytuł jest na ikonie ale gdy dodaję wartość dla odstępu między wierszami to cały div przesuwa mi się w dół o tą wartość. Nie mam pojęcia jak to zrobić aby było dobrze.

PA_BLO:
To ja Ci podam na przykładzie, gdzie niedawno sam tak zrobiłem na nadchodzący szablon na mojej stronie.
Otóż divowi z ikoną wpisu nadajesz wartość z-index: 1; zaś divowi w którym umieścisz tytuł dajesz wartość z-index: 2;

Oto CSS:

--- Kod: ---div#posts-thumb{
width: ...px;
height: ...px;
background-image: ...;
background-repeat: no-repeat;
z-index: 1;
position: relative;
}

div.post-caption{
z-index: 2;
width: ...px;
height: ...px;
background-color: transparent;
bottom: 45px;
position: absolute;
}
--- Koniec kodu ---

Oczywiście wartość bottom możesz sobie zmienić, ja podałem akurat 45px aby tytuły były 45px od dolnej krawędzi ikony.

A kod HTML wygląda tak:

--- Kod: ---<div id="posts-thumb">
<div class="post-caption">
TU DAJESZ TYTUŁ POSTU
</div>
<?php
if ( has_post_thumbnail() ) {
 set_post_thumbnail_size( SZEROKOŚĆ, WYSOKOŚĆ );
 the_post_thumbnail();
}
?>
</div>
--- Koniec kodu ---

Korzystam z takiego kodu i mi zawsze działał. Oczywiście jeśli tytuł postu ma być w postaci linku to pamiętaj aby zrobić dodatkowy styl dla:
div.post-caption a:link, div.post-caption a:active, div.post-caption a:visited{...} oraz dla div.post-caption a:hover{...}

Drew:
Dzięki wielkie!! Działa ;-D

Skye:
a dodam jeszcze, że chodzi o te słynne indexy w cssie, czyli warstwy w divach:)

Polecana lektura: https://www.google.pl/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&uact=8&ved=0CC8QFjAA&url=http%3A%2F%2Fwww.w3schools.com%2Fcssref%2Fpr_pos_z-index.asp&ei=SKFmU6uoD9LY0QWcoIHQBg&usg=AFQjCNGo5mGU8EL1dtgS5oJ1TZIetDBRjA&sig2=pery7hS_8ELrMlZZ2yroaw

Narwana:
Cześć. Wiecie może, jak ustawiać nagłówki wpisów, coś takiego jak jest np. tutaj http://gleeclub.pl/? Przejrzałam już dziesiątki stron, przekopałam całe to forum i domyślam się, że pewnie w tym temacie może o to chodzić, ale kompletnie nie wiem, gdzie i co wkleić, jaki kod... Proszę o pomoc! : (

Nawigacja

[0] Indeks wiadomości

[#] Następna strona