Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [HTML][CSS]różne rozdzielczości a pasek przeiwjania
-dr4g0n79-
post 23.10.2008, 16:03:40
Post #1





Goście







Jeszcze jedno mam małe pytanko:

Jak zrobić aby wstawić diva, i żeby ten div w zależności od rozdzielczości przeglądarki albo się wyświetlał cały albo tylko jego środkowa część

np. mam obrazek o szerokości 1000px i np przy rozdzielczości 800x600 nie chciałbym aby pojawił się poziomy pasek przewijania tylko, żeby tego diva była wyświetlona środkowa część a boki żeby ucieło?

Pozdr!

Ten post edytował dr4g0n79 23.10.2008, 16:08:15
Go to the top of the page
+Quote Post
nithajasz
post 23.10.2008, 17:37:50
Post #2





Grupa: Zarejestrowani
Postów: 230
Pomógł: 27
Dołączył: 27.05.2008
Skąd: Warszawa

Ostrzeżenie: (0%)
-----


No to chyba za pomocą js sprawdzasz rozdzielczość ekranu i w zależności od tego przycinasz tego diva.

Ewentualnie :

Kod
div {
    width: 100%;
    margin: 10px;
}


i będziesz miał na całą szerokość z marginesem od krawędzi 10px obojętnie jaką rozdzielczość napotkasz.
Go to the top of the page
+Quote Post
-dr4g0n79-
post 23.10.2008, 18:21:29
Post #3





Goście







a może mam taki pomysł zrobię trzy divy środkowy dajmy na to o szerokości 800 px natomiast po lewej żeby się dopełniał razem z tym po prawej do całości ekranu. Poniżej jakoś to zoobrazuję:

<jeden wielki div>
<div lewy w zaleznosci od rozdzielczosci><div srodkowy zawsze rozdzielczosc 800><div prawy w zaleznosci od rozdzielczosci ale równe div lewy>
<koniec jednego wielkiego diva>

Czy jest jakaś możliwość aby to osiągnąć na css. Kombinuje ale nie wychodzi, macie jakieś sugestie??
Go to the top of the page
+Quote Post
nevt
post 23.10.2008, 19:27:50
Post #4





Grupa: Przyjaciele php.pl
Postów: 1 595
Pomógł: 282
Dołączył: 24.09.2007
Skąd: Reda, Pomorskie.

Ostrzeżenie: (0%)
-----


można to zrobić na 1 div i bez użycia JS:
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
  4. <style type="text/css">
  5. * {margin: 0px; padding: 0px;}
  6. html, body {width: 100%; height: 100%;}
  7. body { overflow: hidden }
  8. #box {width: 800px; height: 300px; border: 1px solid red; background-color: yellow; margin-left: 50%; position: relative; left:-400px; text-align: center}
  9. </head>
  10. <div id="box">TEST</div>
  11. </body>
  12. </html>

powodzenia


--------------------

-
Oh no, my young coder. You will find that it is you who are mistaken, about a great many things... -
Go to the top of the page
+Quote Post
crazy191
post 14.12.2009, 11:43:37
Post #5





Grupa: Zarejestrowani
Postów: 79
Pomógł: 6
Dołączył: 20.04.2009

Ostrzeżenie: (0%)
-----


Wszystko ładnie działa. Tylko chciałbym tak zrobić żeby przy małych rozdzielczościach pojawił się poziomy pasek przewijania... Bo tym przykładzie wyświetla cześć strony bez paska. Jak to zrobić??
Go to the top of the page
+Quote Post
zordon
post 14.12.2009, 11:48:37
Post #6





Grupa: Zarejestrowani
Postów: 358
Pomógł: 78
Dołączył: 4.11.2008
Skąd: Kraków

Ostrzeżenie: (0%)
-----


overflow: auto
Go to the top of the page
+Quote Post
crazy191
post 14.12.2009, 12:03:21
Post #7





Grupa: Zarejestrowani
Postów: 79
Pomógł: 6
Dołączył: 20.04.2009

Ostrzeżenie: (0%)
-----


Niestety nie działa... Chodzi mi o to że jak dam width and height w px a nie w procentach to wtedy sie ten poziomy pasek przewijania pojawia ale znowu nie centruje strony. A chce żeby mój główny container był zawsze na środku, a jak nie bedzie sie miesci na stronie to pojawi się poziomy pasek przewijania...

Go to the top of the page
+Quote Post
zordon
post 14.12.2009, 12:19:33
Post #8





Grupa: Zarejestrowani
Postów: 358
Pomógł: 78
Dołączył: 4.11.2008
Skąd: Kraków

Ostrzeżenie: (0%)
-----


ze stronami dopasowanymi do rozdzielczości strony są same kłopoty. polecałbym zrobić szerokość "na sztywno", do diva glownego marginesy boczne na auto i jak sie boisz ze ci sie cos moze nie zmiescic to overflow: auto.
przeczytaj http://www.kurshtml.boo.pl/css/staly_szablon,szablon.html tam masz fajny opis jak to zrobić, a jak się uprzesz na ten płynny szablon to nastepna pozycja menu
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 24.07.2025 - 15:28