Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [CSS] Div width
Szymoneks12
post
Post #1





Grupa: Zarejestrowani
Postów: 67
Pomógł: 1
Dołączył: 31.03.2010

Ostrzeżenie: (10%)
X----


Mam diva w divie.

Div nr.1 (główny) ma w sobie diva nr.2.


No i div nr. 1 ma height 100% i width 65%. Jest on wyśrodkowany.

Div nr.2 ma 50% height i 100% width. Ma on scrolla pionowego.

Tyle że scroll nie działa, a strona się wydłuża. Co robię źle?

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

Kod:

HTML:

  1. <div class="strona">
  2. BLABLABLA
  3.  
  4. <div id="wyborprezentu">
  5. BLABLABLA
  6. </div>
  7.  
  8. BLABLABLA
  9. </div>


CSS:
  1. div.strona {
  2.  
  3. background-color: yellow;
  4. border: 5px ridge;
  5. border-color: #000000;
  6. margin-left: auto;
  7. margin-right: auto;
  8. width: 65%;
  9. height: 100%;
  10.  
  11. }
  12.  
  13. div#wyborprezentu {
  14.  
  15. overflow: auto;
  16. height: 50%;
  17. border: 5px ridge;
  18. border-color: #333333;
  19.  
  20. }

Go to the top of the page
+Quote Post
blahy
post
Post #2





Grupa: Zarejestrowani
Postów: 82
Pomógł: 22
Dołączył: 20.07.2010

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


jak wpiszesz wiecej tekstu to sie bedzie scrollowal ten w wyborprezentu. a jak zmieniasz wymiary okna to bedzie zmienial swoja wielkosc bo jest na procent. wg mnie dizala to tak jak opisales ze chcesz zeby dzialalo (przynajniej na chrome)
Go to the top of the page
+Quote Post
krzysztof_kf
post
Post #3





Grupa: Zarejestrowani
Postów: 1 135
Pomógł: 158
Dołączył: 19.03.2009
Skąd: Toruń

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


Działa także na FF tylko wpisz więcej tekstu bo jak myślisz że przy jednym słowie zaraz pokaże się scroll ? (IMG:style_emoticons/default/smile.gif)
Go to the top of the page
+Quote Post
Szymoneks12
post
Post #4





Grupa: Zarejestrowani
Postów: 67
Pomógł: 1
Dołączył: 31.03.2010

Ostrzeżenie: (10%)
X----


Ja mam w operze i scrolla nie widać (wpisałem bardzo dużo tekstu), natomiast strona się rozciąga w dół.
Go to the top of the page
+Quote Post
gigzorr
post
Post #5





Grupa: Zarejestrowani
Postów: 652
Pomógł: 47
Dołączył: 6.02.2010
Skąd: Radom

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


to daj overflow: scroll?
Go to the top of the page
+Quote Post
Szymoneks12
post
Post #6





Grupa: Zarejestrowani
Postów: 67
Pomógł: 1
Dołączył: 31.03.2010

Ostrzeżenie: (10%)
X----


Pojawiają się dwa zablokowane scrolle. (Pionowy i poziomy)

Ten post edytował Szymoneks12 31.07.2010, 14:03:46
Go to the top of the page
+Quote Post
malminiart
post
Post #7





Grupa: Zarejestrowani
Postów: 17
Pomógł: 0
Dołączył: 16.05.2009
Skąd: GB

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


pojawiaja sie dwa zablokowane scroll'e bo zawartosc nie wymaga jeszcze scrollowania (IMG:style_emoticons/default/snitch.gif)

co do height: 100% to dziala tylko jezeli parent zagniezdzonego div'a ma okreslona wysokosc... bez tego nie wie jaka ona jest (tak po krotce)

oto rozwiazanie

Kod
<style type="text/css">
html, body {               /*<<<<<<<<<<<<<<<<<<< dodanie height:100% do sekcji body i html */
height: 100%;
}

div.strona {

    background-color: yellow;
    border: 5px ridge;
    border-color: #000000;
    margin-left: auto;
    margin-right: auto;
    width:  80%;
    height:100%;

}

div#wyborprezentu {

    overflow: auto;
    height: 30%;
    width: 80%;
    border: 5px ridge;
    margin:0px auto;
    border-color: #333333;

}
</style>

</head>
<body>
<div class="strona">
DIV 80% szerokosci i  100% wysokosci

                 <div id="wyborprezentu">
                           DIV 80% szerokosci rodzica i 30% wysokosci rodzica
                  </div>


</div>
</body>
</html>
Go to the top of the page
+Quote Post
gigzorr
post
Post #8





Grupa: Zarejestrowani
Postów: 652
Pomógł: 47
Dołączył: 6.02.2010
Skąd: Radom

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


Cytat(Szymoneks12 @ 31.07.2010, 14:55:32 ) *
Pojawiają się dwa zablokowane scrolle. (Pionowy i poziomy)



to daj overflow-x: hidden albo y i ci zniknie ktorys tam , a rozwinie sie jak bedzie duzoooo tresciiiii.
Go to the top of the page
+Quote Post
krzysztof_kf
post
Post #9





Grupa: Zarejestrowani
Postów: 1 135
Pomógł: 158
Dołączył: 19.03.2009
Skąd: Toruń

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


A masz odpowiedni Typ dokumentu ? jaką masz operę z przed świecznych lat ? aktualizujesz w ogóle .
Go to the top of the page
+Quote Post
Szymoneks12
post
Post #10





Grupa: Zarejestrowani
Postów: 67
Pomógł: 1
Dołączył: 31.03.2010

Ostrzeżenie: (10%)
X----


Niestety nie mogę dodać:
  1. html, body {
  2. height: 100%;
  3. }


Mogę tylko mieć:
  1. body {
  2. height: 100%;
  3. }


Inaczej strona się "rozjeżdża". Nie ma innego sposobu?

Link: http://prezenty.c0.pl/wyborprezentu.php
Go to the top of the page
+Quote Post
XP'ek
post
Post #11





Grupa: Zarejestrowani
Postów: 263
Pomógł: 9
Dołączył: 3.05.2009
Skąd: Wroc

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


w css wstaw sobie to

  1. overflow-y:scroll;
  2. overflow-x:hidden;

tylko odpowiednio na swoje potrzeby jak coś modyfikacje zrób (IMG:style_emoticons/default/smile.gif)
Go to the top of the page
+Quote Post
Szymoneks12
post
Post #12





Grupa: Zarejestrowani
Postów: 67
Pomógł: 1
Dołączył: 31.03.2010

Ostrzeżenie: (10%)
X----


Rozwiązałem problem.



Rozwiązanie:

max-height w CSS-ie.


Do zamknięcia.

Ten post edytował Szymoneks12 3.08.2010, 15:38:35
Go to the top of the page
+Quote Post

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

 



RSS Aktualny czas: 16.09.2025 - 15:35