Post
#1
|
|
|
Grupa: Zarejestrowani Postów: 7 Pomógł: 0 Dołączył: 14.08.2007 Ostrzeżenie: (0%)
|
Witam,
Mam nadzieję, że temat nie jest po raz enty taki sam... Niestety nie udało mi się znaleźć odpowiedzi na pytanie na forum ani w googlach mimo ponad godziny poświęconej na przeglądanie różnych stron. Chciałbym zbudować prosty layout, w którym treść znajdowała by się w warstwie oddalonej o stałą wartość (20px) od prawej, górnej i dolnej krawędzi przeglądarki. Chciałbym ustalić procentową wartość szerokości, natomiast wysokość chciałbym żeby była dostosowana do założenia o oddaleniu od krawędzi. Do celów testowych stworzyłem taką oto stronę: CODE <head> <link rel="Stylesheet" type="text/css" href="style.css" /> </head> <body> <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean pellentesque. </div> </body> Oraz taki oto plik style.css: CODE body { background-color: green; background-image: url(obraz.jpg); background-position: 0 0; background-repeat: no-repeat; background-attachment: fixed; } div{ background-color: white; background-image: url(obraz1.jpg); background-position: 0 0; background-repeat: no-repeat; background-attachment: fixed; position: absolute; left: auto; right: 20px; top: 20px; bottom: 20px; width: 60%; border-top-width: 5mm; border-top-style: solid; border-bottom-width: 5mm; border-bottom-style: solid; } Posiadam przeglądarki: google chrome, opera oraz mozilla firefox. Wszystkie w najnowszych wersjach. W dwóch pierwszych test wypadł pomyślnie. Efekt zamierzony osiągnięty. Jednak w firefoxie obie części bordera (górna i dolna) zbiły się w jedną (tak jakby wysokość była równa zero), natomiast tekst ukrył się na dolnym borderze (przy większej ilości tekstu, opuszcza on swobodnie krawędź i wchodzi na zielone tło) Pytanie chyba oczywiste ;-) Co robię nie tak. Z góry dziękuję za odpowiedź i pozdrawiam rokefeler15 Ten post edytował rokefeler15 5.03.2009, 09:29:10 |
|
|
|
![]() |
Post
#2
|
|
|
Grupa: Moderatorzy Postów: 15 467 Pomógł: 1451 Dołączył: 25.04.2005 Skąd: Szczebrzeszyn/Rzeszów |
|
|
|
|
Post
#3
|
|
|
Grupa: Zarejestrowani Postów: 7 Pomógł: 0 Dołączył: 14.08.2007 Ostrzeżenie: (0%)
|
Ad 1. Będę się tego trzymał, dziękuję ;-)
Ad 2. http://fiedukowicz.abajt.pl/ly/ Wrzucone pliki których kod wyżej podałem Dodam jeszcze, że taki sam efekt uzyskuję, gdy używam <p></p> zamiast <div></div> |
|
|
|
Post
#4
|
|
|
Grupa: Moderatorzy Postów: 15 467 Pomógł: 1451 Dołączył: 25.04.2005 Skąd: Szczebrzeszyn/Rzeszów |
overflow:hidden dla rodzica albo wyzeruj marginesy dla <p />.
|
|
|
|
Post
#5
|
|
|
Grupa: Zarejestrowani Postów: 7 Pomógł: 0 Dołączył: 14.08.2007 Ostrzeżenie: (0%)
|
Jeśli dobrze zrozumiałem (co powinienem zrobić), to niestety nie pomogło.
======================================= Edit: position: relative; należy wywalić z body. To pomogło ;-) Problem rozwiązany |
|
|
|
![]() ![]() |
|
Aktualny czas: 21.12.2025 - 02:12 |