MozillaPL.org - polskie centrum Mozilli

Główne menu:

[css, div, html] Div w divie

Jak tworzyć strony WWW zgodnie ze standardami

Moderator: Pomocy?!

[css, div, html] Div w divie

Postautor: Krowa » 07 marca 2010, 12:34

Przeglądarka: Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US) AppleWebKit/532.5 (KHTML, like Gecko) Chrome/4.0.249.89 Safari/532.5

Witam,
Nie mogę sobie poradzić ze zmianą wysokości diva ważniejszego, tak by rozszerzał się sam wraz ze zwiększaniem treści w divie środkowym. Czytałem na forum ale metody:
Kod: Zaznacz cały
 <div id="1" style="min-height: 100%">
<div style="height: 100%">
dane
</div>
</div>

niewiele działają. Czy to zadeklarowane w html'u tak jak w kodzie, czy też w style.css. Bowiem gdy tak zrobię div1 znika, a tamten jest luzem na samym body. Jaki jest sposób "automatycznej" zmiany wysokości diva1?
Krowa
 

Odp: [css, div, html] Div w divie

Postautor: Tomek » 07 marca 2010, 12:46

Przeglądarka: Mozilla/5.0 (X11; U; Linux i686; pl; rv:1.9.3a3pre) Gecko/20100306 Minefield/3.7a3pre

Podałeś fragment kodu... pokaż cały - będzie nam łatwiej dojść o co ci chodzi. Bez całości kodu (html + css) możemy tylko zgadywać gdzie tkwi błąd - w kodzie czy w rozumowaniu kodu ;). Jak na razie - ten fragment normalnie działa - zwiększając zawartość div wewnętrznego div o id="1" (co jest nie do końca poprawne - identyfikatory powinny składać się z więcej niż jednego znaku, niektóre wersje IE mają też problem z id zaczynającym się od cyfry) także się powiększa (widać to idealnie po zastosowaniu np. ramki)

ps. w ślepo obstawiam na stosowanie float :) i nie zakończeniu wyskakiwania elementu (szybka podpowiedź: clear:both)
"Mym sojusznikiem jest Moc, i potężnym sojusznikiem ona jest." -- Mistrz Yoda
Tomek
Moderator
 
Posty: 9041
Z nami od: 19 sierpnia 2004, 06:52

Odp: [css, div, html] Div w divie

Postautor: Krowa » 07 marca 2010, 12:55

Przeglądarka: Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US) AppleWebKit/532.5 (KHTML, like Gecko) Chrome/4.0.249.89 Safari/532.5

Kod: Zaznacz cały
<div id="cale">
      <div id="menu">
         <ul>
            <li><a href="a.html">strona pierwsza</a></li>
            <li><a href="b.html">strona druga</a></li>
         </ul>
      </div>
      <div id="main">
         główna część strony
      </div>
   </div>

Kod: Zaznacz cały
#cale {
   width:900px;
   background-color: fff;
   position: relative;
   height:100%;
   
}

#menu {
   margin-top:30px;
   height: 100%;
   width: 210px;
   float: left;
   margin-left:30px;
}

#main {
   height:90%;
   width:600px;
   overflow:auto;
   float:right;
   background-color: black;
   margin-right:30px;
   margin-top:30px
}

Teraz jest tak i wychodzi nieporządany suwak. A gdy zmienię w #cale na min-height:100%;, a #main height:100%; to właśnie znika białe czyli #cale.
Krowa
 

Odp: [css, div, html] Div w divie

Postautor: Tomek » 07 marca 2010, 13:20

Przeglądarka: Mozilla/5.0 (X11; U; Linux i686; pl; rv:1.9.3a3pre) Gecko/20100306 Minefield/3.7a3pre

Podaj cały kod - nie mam zamiaru zgadywać jakie Doctype stosujesz, jak to wszystko jest osadzone itp itd. Nie mam zamiaru zgadywać czy czasem nie masz gdzieś niedomknięte znacznika itp itd....
U mnie na chwilę obecną nie pokazuje żadnego suwaka... wszystko się ładnie rozszerza, bez żadnych kombinacji. Możliwe że jakieś inne zagnieżdżenie powoduje problem.
Opisz dokładnie co chcesz osiągnąć. Bo lay który na razie pokazujesz nie jest niczym skomplikowanym... 2 kolumny w divie.
ps. <div id="menu"><ul> - a nie lepiej samo <ul id="menu">
"Mym sojusznikiem jest Moc, i potężnym sojusznikiem ona jest." -- Mistrz Yoda
Tomek
Moderator
 
Posty: 9041
Z nami od: 19 sierpnia 2004, 06:52

Odp: [css, div, html] Div w divie

Postautor: Krowa » 07 marca 2010, 13:25

Przeglądarka: Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US) AppleWebKit/532.5 (KHTML, like Gecko) Chrome/4.0.249.89 Safari/532.5

Rzecz jest taka, że w operze, IE, seamonkayu mi też się rozszerza, a w Chrome i FF nie.
Kod: Zaznacz cały
<html>
   <head>
      <title>Tytuł strony</title>
      <link rel="Stylesheet" type="text/css" href="style.css" />
      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
      <style type="text/css">
         /* <![CDATA[ */
         div { fontsize: 13px; font-family: Arial, Helvetica, Verdana, sans-serif; color: white; text-align: justify;}
         span { fontsize: 13px; font-family: Arial, Helvetica, Verdana, sans-serif; color: black; text-align: justify; background-color: black }
         p { fontsize: 13px; font-family: Arial, Helvetica, Verdana, sans-serif; color: black; text-align: justify; }
         /* ]]> */
      </style>
</head>
<body background="./img/background.jpg">
   <center>
      <div id="top">
         Tu będzie nagłówek
      </div><br>
   <div id="cale">
      <div id="menu">
         <ul>
            <li><a href="a.html">Krowa w praktyce</a></li>
            <li><a href="b.html">Janek, a krowa</a></li>
            <li><a href="c.html">Lubimy krowy</a></li>
            <li><a href="d.html">Krowa - teoria</a></li>
            <li><a href="e.html">Krowa fajna rzecz</a></li>
            <li><a href="e.html">Holsztyno-fryzyjska rasa bydła</a></li>
         </ul>
      </div>
      <div id="main">
         główna część strony,   </div>
   </div>
</body>
</html>
Krowa
 

Odp: [css, div, html] Div w divie

Postautor: Tomek » 07 marca 2010, 13:37

Przeglądarka: Mozilla/5.0 (X11; U; Linux i686; pl; rv:1.9.3a3pre) Gecko/20100306 Minefield/3.7a3pre

1. brak Doctype - więc każda przeglądarka będzie inaczej renderować....
2. u mnie zarówno w fx (zarówno 3.6 jaki i 3.7), w operze, chrome wszystko wygląda identycznie. Sprawdź czy czasem w Fx adblockiem nie blokujesz jakiegoś stylu. (ps - kod połączyłem z 2 twoich postów)
Fx:
Obrazek
Opera:
Obrazek
"Mym sojusznikiem jest Moc, i potężnym sojusznikiem ona jest." -- Mistrz Yoda
Tomek
Moderator
 
Posty: 9041
Z nami od: 19 sierpnia 2004, 06:52

Odp: [css, div, html] Div w divie

Postautor: Krowa » 07 marca 2010, 13:54

Przeglądarka: Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US) AppleWebKit/532.5 (KHTML, like Gecko) Chrome/4.0.249.89 Safari/532.5

No to mi nawet po dodaniu docutype nie wychodzi. Adblocka nie mam bo FF używam sporadycznie, właśnie do sprawdzania stron. Pomęczę to jeszcze, ale dzięki.
Krowa
 

Odp: [css, div, html] Div w divie

Postautor: Tomek » 07 marca 2010, 13:55

Przeglądarka: Mozilla/5.0 (X11; U; Linux i686; pl; rv:1.9.3a3pre) Gecko/20100306 Minefield/3.7a3pre

Sprawdzałem u siebie bez doctype - po prostu skopiowałem twój kod - bez żadnych zmian, bez niczego.
"Mym sojusznikiem jest Moc, i potężnym sojusznikiem ona jest." -- Mistrz Yoda
Tomek
Moderator
 
Posty: 9041
Z nami od: 19 sierpnia 2004, 06:52

Odp: [css, div, html] Div w divie

Postautor: Krowa » 07 marca 2010, 14:12

Przeglądarka: Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US) AppleWebKit/532.5 (KHTML, like Gecko) Chrome/4.0.249.89 Safari/532.5

A teraz pozmieniałem trochę w stylach
Kod: Zaznacz cały
#cale {
   width:900px;
   background-color: green;
   position: static
   min-height:100%;
   }

#menu {
   margin-top:30px;
   height: 400px;
   width: 210px;
   float: left;
   margin-left:30px;
}

#main {
   position: static
   float: right;
   height:100%;
   width:600px;
   background-color: black;
   margin-right:30px;
   margin-top:30px
}

I mam coś takiego: http://img297.imageshack.us/img297/8287/beztytuug.jpg Prawie dobrze, tyle że czarne jest na środku a nie 30px od prawego końca diva. To coś trzeba pokombinować z position:?
Krowa
 

Odp: [css, div, html] Div w divie

Postautor: Tomek » 07 marca 2010, 15:04

Przeglądarka: Mozilla/5.0 (X11; U; Linux i686; pl; rv:1.9.3a3pre) Gecko/20100306 Minefield/3.7a3pre

Sorki - ale znowu podajesz fragment stylu/kodu, pokazujesz zrzut z którego jasno wynika że kodu masz więcej... i chcesz żebyśmy próbowali zgadywać co jest nie tak.
"Mym sojusznikiem jest Moc, i potężnym sojusznikiem ona jest." -- Mistrz Yoda
Tomek
Moderator
 
Posty: 9041
Z nami od: 19 sierpnia 2004, 06:52

Odp: [css, div, html] Div w divie

Postautor: Staty » 15 lutego 2012, 18:26

Przeglądarka: Opera/9.80 (Windows NT 5.1; U; en) Presto/2.10.229 Version/11.61

Jesli masz div w divie , mianowicie:

Kod: Zaznacz cały
<div style="background-color:#ccc;width:500px;min-height:200px;overflow: hidden;">
<div style="float:left;">
Lewa Czesc i ciagle przybierajacy tekst ...i ciagle przybierajacy tekst ...i ciagle przybierajacy tekst ...i ciagle przybierajacy tekst ...
</div>
<div style="float:right;">Prawa czesc</div>

</div>



i div ten w srodku Ci sie rozciaga a ten glowny (na zewnatrz) Ci sie nie rozciaga, to wystarczy mu dokleic opcje : overflow:hidden; dla glownego diva :)
Staty
 

Odp: [css, div, html] Div w divie

Postautor: Gość » 27 kwietnia 2012, 21:50

Przeglądarka: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/535.19 (KHTML, like Gecko) Chrome/18.0.1025.162 Safari/535.19

zapamietajcie i nie kombinujcie, to jest bardzo proste
<div class="glowny">
<div></div>
<div></div>
</div>

otóż w głównym wystarczy ustawic float:left i sie sam bedzie rozciagal
Gość
 


Wróć do Tworzenie stron WWW

Kto jest online

Zarejestrowani użytkownicy: Bing [Bot], dexter, Google [Bot]

Przejdź do powiązanej strony

Nawigacja:

Stopka: