| Autor | Zpráva | ||
|---|---|---|---|
| Tomáš123 Profil |
#1 · Zasláno: 23. 3. 2014, 21:14:02
Zdravím,
mám problém so stránkou. po nastavení paddingu sa rozťahuje div aj keď má nastavenú šírku. Ďakujem za rady. |
||
| jefitto44 Profil |
Nastav mu max-width... Problém tkvie asi v tom, že nepoužívaš paragrafy, iba máš naostro text v div id="footer" tým pádom mu nemôžeš nastaviť padding, ani margin, lebo prehliadač to berie tak, že si nastavil padding/margin samotnemu footeru... použi do toho <p>copyright</p>
a v CSS nastav #footer p {margin:NNpx;} Teda neviem, či je to ten problém, lebo si neudal viac |
||
| Tomáš123 Profil |
#3 · Zasláno: 24. 3. 2014, 14:47:33
jefitto44:
Problém si pochopil správne ale: -pri nastavení max-width sa nič nestalo
-pri použití paragrafu sa stalo následovné- tá medzera nad footerom tam nemá byť. V skratke mi ide o to aby div ktorý má padding: 0; bol tak isto široký ako div čo má padding: 10px;. Možno sa ti zdá, že vymýšľam somariny, ale praktické využitie je takéto:
Potrebujem aby bolo menu na celú šírku hlavičky t.j. aby nebolo na krajoch vidno pozadie headeru a aby div main bol tak isto široký ako header, aj keď bude mať nastavený padding aby sa text nelepil ku krajom. |
||
| jefitto44 Profil |
#4 · Zasláno: 24. 3. 2014, 15:08:14
Jasne, že ti tam p dalo medzeru, lebo si nepoužil css reset... čiže niekde na začiatok CSS-ka daj p {margin:0; padding:0;}
Prehliadače si inak pridávajú vlastné marginya paddingy podľa vlastného uváženia. Vlastne celé CSS funguje tak, že čo nenastavíš, to si prehliadač vykreslí podľa vlastného uváženia |
||
| Bubák Profil |
Tomáš123:
„V skratke mi ide o to aby div ktorý má padding: 0; bol tak isto široký ako div čo má padding: 10px;“ http://www.webylon.info/K.10#H Od napsání článku došlo ke změnám, IE6 vymizel a IE7 skoro také a IE 8 box-sizing umí. Pokud použiješ box-sizing, tak důrazně doporučuji přidat prefix pro Firefox a pro jistotu i pro prohlížeče založené na jádru WebKit. Koukni také na -moz-box-sizing. jefitto44: „podľa vlastného uváženia“ Až tak? |
||
| Tomáš123 Profil |
#6 · Zasláno: 24. 3. 2014, 15:30:48
Bubák:
Teda ak som to správne pochopil, pre dosiahnutie cieľa musím buď použiť border-box alebo nastavovať šírku podľa toho ako to chcem mať široké -(mínus) padding.(ak nie vyveď ma prosím z omylu) Keď si prezrieš moje CSS: html, body {
height: 100%;
max-width: 100%;
-moz-box-sizing: border-box;
}
.header, .main, .footer {
width: 740px;
max-width: 740px;
margin: 0 auto;
}
p {
margin: 0;
padding: 0;
}-moz-box-sizing správne?
jefitto44: ďakujem, opravil som to [#3] klikni na následovné ale asi sa vydám cestou Bubáka |
||
| Tomáš123 Profil |
Bubák:
html, body {
height: 100%;
max-width: 100%;
}
.header, .main, .footer {
min-width: 300px;
max-width: 740px;
margin: 0 auto;
box-shadow: 5px 5px 2px #888;
box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-webkit-box-sizing: border-box;
}Dobre, takže som to urobil takto a otestoval to v chrome, mozile a všetko ide ale explorer nechce spolupracovať- Čo sa používa pre explorer? (myslím: -xxx-box-sizing: border-box;) Ale aj tak som čítal, že v IE je takéto vykresľovanie automatické, tak prečo ako jediný kladie odpor. |
||
| jefitto44 Profil |
#8 · Zasláno: 24. 3. 2014, 19:32:25
Bubák:
„Až tak?“ Jj, raz som robil footer so šírkou 100%... v chrome pohoda. Ale mozila si tam z nejakých dôvodov dala 5px medzery po obidvoch stranáach... CSS reset od erika majera pomohol, lebo nuluje marginy a padingy všetkého |
||
|
Časová prodleva: 10 let
|
|||
0