Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [CSS] narożniki w zmiennej wielkości div'ie
Forum PHP.pl > Forum > Przedszkole
r4xz
problem:

rozwiązanie:
  1. <div id="pudlo">
  2. <div class="p2">
  3. <div class="p3">
  4. <div class="p4">
  5. tutaj dopiero tekst
  6. </div>
  7. </div>
  8. </div>
  9. </div>

Kod
#pudlo {
    width: 242px;
    height: 754px;
    background: #0F3s56 url('1_naroznik.gif') top left no-repeat;
}

.p2 {
    background: url('2_naroznik.gif') top right no-repeat;
}

.p3 {
    background: url('3_naroznik.gif') bottom right no-repeat;
}

.p4 {
    background: url('4_naroznik.gif') top left no-repeat;
    padding: 8px;
}


ma ktoś pomysł na lepsze rozwiązanie tego problemu?
eamzeet
Tutaj jest zaprezentowana jedna z technik zaokrąglonych rogów.
Wklejam ją bo podobnie wykorzystuje 4 obrazki i css.
r4xz
tu chyba jednak lepiej zastosować zaprezentowaną przeze mnie metodę - oszczędność miejsca (CSS) i większa przejrzystość winksmiley.jpg

PS widzę, że jednak nie ma na to idealnego rozwiązania. no trudno dry.gif
Kildyt
Cytat(r4xz @ 8.06.2010, 21:58:53 ) *
tu chyba jednak lepiej zastosować zaprezentowaną przeze mnie metodę - oszczędność miejsca (CSS) i większa przejrzystość winksmiley.jpg

PS widzę, że jednak nie ma na to idealnego rozwiązania. no trudno dry.gif
Twój pomysł jest dobry, ale źle wykonany. Dlaczego rogi się nie dostosowują? A bo zawartość to p4, a ty zdefiniowałeś wymiary w pudlo, który odpowiada tylko za lewy narożnik.

PS Za niedługo CSS 3 wypłynie na szerokie wody i będzie spokój. Uff...
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.
Invision Power Board © 2001-2025 Invision Power Services, Inc.