| Autor | Zpráva | ||
|---|---|---|---|
| Klasounek Profil * |
Zdravím, mrkněte prosím sem (viz. zdrojový kód stránky, ať to sem nemůsím kopírovat) Mám tam pár vnořených DIVů.
Ale někde je chyba a já už jsem asi slepej. Proč mi např. když napíšu text s <p> do main divu (s textem: "Tady bude hlavni obsah") to posune s celým DIVem, do kterého je text vepsán? Lze vidět, jak je celý blok posunut dolů o jeden řádek... CSS: body {
margin: 0px;
padding: 0px;
background-color: #37424b;
text-align: center;
font-family: tahoma;
font-size: 12px;
line-height: 15px;
color: #a2adb7;
}
#content {
margin: 8px auto 0em;
width: 850px;
height: 895px;
background-color: #24292f;
text-align: center;
}
#content2 {
width: 760px;
margin: 0em auto 0em auto;
}
#logo {
float: left;
margin:0;
width: 238px;
}
#logo-content {
margin:0; padding: 0;
height: 111px;
}
#menu {
float: left;
margin:0;
width: 522px;
}
#menu-content {
margin:0; padding: 0;
height: 111px;
background-color: #2e353b;
}
#hlavicka {
float: left;
width: 760px;
_margin:-3px 0px 0px 0px;
height: 203px;
background: url('soubory/hlavicka.jpg'); background-repeat: no-repeat;
}
#hlavicka-content {
}
#ucebny-nadpis {
float: left;
margin:0;
width: 238px;
}
#ucebny-nadpis-content {
margin:0; padding: 0;
height: 45px;
background-color: #000000;
text-align: left;
font-family: arial;
font-size: 18px;
line-height: 15px;
color: #e5e5e5;
}
#onas {
float: left;
margin:0;
width: 522px;
}
#onas-content {
margin:0; padding: 0;
height: 45px;
background: url('soubory/o-nas-podklad.jpg'); background-repeat: no-repeat;
background-color: #383f47;
text-align: left;
font-family: arial;
font-size: 18px;
line-height: 15px;
color: #e5e5e5;
}
#ucebny {
float: left;
margin:0;
width: 238px;
height: 463px;
background-color: #383f47;
}
#ucebny-content {
margin:0; padding: 0;
height: 199px;
background: url('soubory/linka_ruzova.jpg'); background-repeat: no-repeat;
}
#kontakt-nadpis-content {
margin:0; padding: 0;
height: 45px;
background-color: #000000;
text-align: left;
font-family: arial;
font-size: 18px;
line-height: 15px;
color: #e5e5e5;
}
#kontakty-content {
margin:0; padding: 0;
height: 219px;
background-color: #383f47;
background: url('soubory/linka_ruzova.jpg'); background-repeat: no-repeat;
}
#main {
float: left;
margin:0;
width: 522px;
background-color: #2e353b;
}
#main-content {
margin:0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
height: 463px;
text-align: left;
background: url('soubory/linka_cerna.jpg'); background-repeat: no-repeat;
}
#zapati-copy {
float: left;
margin:8px 0px 0px 0px;
width: 238px;
height: 45px;
padding: 0px 0px 0px 0px;
background-color: #e50083;
text-align: left;
color: white;
}
#zapati-g73 {
float: left;
background-color: #000000;
height: 45px;
width: 522px;
margin: 8px 0px 0px 0px;
text-align: left;
}
img {
border: 0px;
}
hr.cleaner {
clear:both;
height:1px;
margin: -1px 0 0 0; padding:0;
border:none;
visibility: hidden;
}Moderátor Chamurappi: Vkládej prosím kódy mezi značky [pre] a [/pre] (stačí kliknout na
 ). |
||
| zvěřiňák Profil |
#2 · Zasláno: 12. 10. 2009, 03:57:21
Takhle to tam máš zapsaný:
<div id="main"> <div id="main-content"> <p style="margin: 10px 0px 0px;">Tady bude hlavni obsah </p> </div> </div> Tak se posune dolů. |
||
| Klasounek Profil * |
#3 · Zasláno: 12. 10. 2009, 08:25:38
Hmm, a kde je problém, nějak to nechápu. (u margin pokud dobře koukám, mám všechny 4 hodnoty). Nechápů, proč se posune celý DIV, když odstavec je uvnitř? Pokud hodím text bez odstavce, třeba jen mezeru, a pak teprve odstavec, tak už je to ok, ale já to prostě nepobírám. Proč mi to u předešlých webů fungovalo...? To samé mi to dělá i pro <div id="ucebny-content"> a <div id="kontakty-content">
|
||
| zvěřiňák Profil |
#4 · Zasláno: 12. 10. 2009, 11:55:45
Promiň, nevšimnul jsem si, že se posouvá celý div a ne jenom odstavec.
Dá se to řešit border-top u divu, který bude mít stejnou barvu jako podklad, aby nebyl vidět. <div id="main"> <div id="main-content" style="border-top: 1px solid #2E353B;"> <p style="margin: 10px 0px 0px;">Tady bude hlavni obsah </p> </div> </div> Někdy se to tady už probíralo, ale nemůžu to najít. Bylo tam i vysvětlení, proč se to tak chová. Třeba to vysvětlí nějaký větší odborník. |
||
| Klasounek Profil * |
#5 · Zasláno: 12. 10. 2009, 12:03:03
No, já to tak nějak částečně vyřešil tím, že jsem ponechal pouze <div id="main"> jemu nadefinoval výšku, atd (výška je důležitá, jelikož jak je vidět na webu, je hodně barevně členitej - každý blok, jiná barva). A <div id="main-content"> jsem prostě zrušil. Pak už to nehabruje. Ale teď to řeším pro <div id="ucebny-content"> a <div id="kontakty-content">, kde už nemám co zrušit...jsem z toho jelen.
Děkuji za tip, ale nějak to nechápu (nejsem teď doma, abych to testnul). Co to vyřeší? Border nějak zamezí tomu, aby se div hnul, nebo tak podobně? |
||
| zvěřiňák Profil |
#6 · Zasláno: 12. 10. 2009, 12:15:10
Mně to taky dělá a tak jsem to tenkrát řešil odstavcem:
<p style="font-size: 0; line-height: 0; height: 0; margin:0; padding: 0;"> </p> Ale nějaké vysvětlení pro to nemám. |
||
| Klasounek Profil * |
#7 · Zasláno: 12. 10. 2009, 12:40:49
No, nějak zalaborovat s prázdným <p> mě taky napadlo, takže tam asi loupnu to co jsi mi tu nadhodil a uvidím --> děkuji Ti.
Zaráží mě třeba i <img> a display:block, na webu před tím mě to nezlobilo a teď jsem na to taky narazil (mezera pod img). Před tím jsem použil průhledný png. Že by se to chovalo jinak než jpg... Fakt divočina občas. Takže díky... |
||
| Klasounek Profil * |
#8 · Zasláno: 12. 10. 2009, 18:24:24
Funguje to bravůrně! Danke
|
||
|
Časová prodleva: 15 let
|
|||
0