| Autor | Zpráva | ||
|---|---|---|---|
| Mihhc Profil * |
#1 · Zasláno: 29. 7. 2011, 16:19:24
Zdravím,
prosím pomoc. mám netovku o několika řádkách, ale dělá mi to neplechu. K věci: Mám obalovací div = orange pod ním další div = černá -> 1. float vlevo -> green, white -> 2. float vpravo -> yellow Chtěl bych ale aby floaty ležely na černém pozadí, zobrazjí se mi na oranžovém. Nevím proč. Též mi nejdou vkládat jako pozadí obrázky naprosto netuím proč. Vkládám zkrácený zdroje: Zdroj HTML <div id="OBAL"> <div id="CENTER"> <div id="LEVO"> <div id="MENU9"> <h1>Úvod</h1> <ul> <li><a class="Active" href="#">Úvod</a></li> </ul> </div> <h2>h21</h2> </div> <div id="PRAVO"> <h1>Bla</h1> </div> </div> </div> ZDroj CSS:
#OBAL { width: 980px; margin: 348px auto ; background: orange; border: solid 1px #ccc; }
#CENTER { width: 960px; margin: 10px auto; background: black; }
#LEVO { width: 300px; margin: 10px 0; float: left; background: green; border-right: solid 1px black}
#MENU9 { width: 300px; height: 476px; background: white;}
#PRAVO { width: 650px; margin: 10px 0; float: right; background: yellow;}
Uvítám vysvětlení problému, i poučení že něco dělám komplet blbě, začínám, předem děkuju, Mihh |
||
| Trejpa Profil |
#2 · Zasláno: 29. 7. 2011, 18:24:49
Mihhc:
Protože nemáš ukončené plavání prvkem s clear.
Nebude to ani oranžové, pokud #obal nemá nastavenu výšku nebo to není <body>. Plovoucí prvky se vyjímají z běžných bloků a jsou-li větší, tak je přetékají. Tvůj obalový blok nemá kole čeho se natáhnout. Přidej třeba <div style=clear:both></div> za poslední plovoucí prvek a obalující blok se kolem všeho roztáhne.
|
||
| hunter_dave Profil |
#3 · Zasláno: 29. 7. 2011, 18:38:45
používej
background-color co se týče vkládání obrázků na pozadí background:url(obrazek.jpg); |
||
| margin Profil * |
#4 · Zasláno: 29. 7. 2011, 21:04:40
Nevidím pro to důvod.
|
||
| Mihhc Profil * |
#5 · Zasláno: 29. 7. 2011, 21:39:44
Děkuju, ale bohužel jsem se dál nedobral výsledku ani v jednom směru.
Trejpa: Já zatím mám ještě patu, takžes jak říkal ta oranžová je i kolem ní. #PATA { clear: both; width: 960px; margin: 0 auto}Ale já bych rád aby ta černá byla pod #LEVO i #PRAVO. Tzn pod těma plovoucíma prvkama. A ta oranžová fungala prakticky jenom jako takový rám kolem stránky včetně patky. Všechny barvy se nyní zobrazují jak mají, jenom ta černá není nikde, pokud tam nedám text. A do žádné divu mi nejde na pozadí hodit obrázek, i když mám dva obrázky na pozadí stránky(tam se zobrazují správně). hunter_dave: Co se týče obrázku, tak přesně takto to vkládám, ale bez úspěchu. Vkládám obrázek pod #MENU9 přesně s rozměry 300x476, proto jsem ten DIV vytvořil. Obrázek se ovšem nevloží. |
||
| Davex Profil |
#6 · Zasláno: 29. 7. 2011, 22:03:06 · Upravil/a: Davex
Mihhc:
Jsi-li začátečník, tak doporučuji studium Jak funguje „float“ a „clear“. Jsou tam základní informace, které by ti měly pomoci s aplikováním Trejpovy rady. |
||
| Mihhc Profil * |
#7 · Zasláno: 30. 7. 2011, 00:54:29
Davex:
Díky díky, tak systému rozumím, takže jsem do toho vložil jeden prázdný div, a dosáhl jsem cíle, já myslel že prádný div se vůbec nezobrazí. Obrázky už jsem tky vyřešil, objevil jsem, že všechny lomítka nejsou na klávesnici stejné ačkoliv míří na stejnou stranu, sice rozdíl nevidím, ale jedno funguje druhé ne. Nuže, za to se omlouvám. Všem Vám děkuju. |
||
|
Časová prodleva: 5 dní
|
|||
| Mihhc Profil * |
#8 · Zasláno: 3. 8. 2011, 21:49:37
Omlouvám se opět za mrtvé téma, ale navazuje to.
Vaši metodu.[#2] Trejpa(zde popisovanou naprosto už chápu) Já jen, že dneska jsem narazil na web, kde byly 4 divy.(krom jinéh samozřejmě)Teda asi takto(píšu to jen informativně, formálně je to blbost, vím to): div id=něco div class=něco2 div id=float:left -> /div div id=float:right ->/div /div /div Všechno to fungovalo, pozadí nastavené v class obalilo i ty dva floaty, já to právně vůbec nepochopil, protože v div id=něco a v div=class bylo napsané skoro to samé(trochu jinhé rozměry(s okraji stejné) a pozadí v class). Ale jak jste mi to vysvětlovali, tak se to neměli kolem čeho natáhnout(div s clear). Děkuju předem za ponaučení MihhC |
||
| Davex Profil |
#9 · Zasláno: 3. 8. 2011, 23:00:41
Mohl tam být takový fígl, že některý z obalujících bloků #něco nebo .něco2 měl nastavenu vlastnost
overflow: hidden, která jako vedlejší efekt způsobí to natažení pozadí okolo vnořených bloků.
|
||
| Mihhc Profil * |
#10 · Zasláno: 4. 8. 2011, 13:18:04
Overflow tam není.
Aha, tak teď jsem si všiml že je v tý class také float: left. Stejně ovšem princip nechápu.
#CONTENT{ width: 760px; margin-left: auto; margin-right: auto; }
#CONTENT .Wrapper{ width: 710px; padding: 0 25px 15px 25px;float: left; background-image: url(bg_margins.gif); background-repeat: repeat-y; background-color: White; }
A tam není daná pevná velikost prvků, takže tam vlastnost oveflow by tam byla k ničemu, teda pokud by tam nebyla právě kvůli tomu vnoření. |
||
| Davex Profil |
#11 · Zasláno: 4. 8. 2011, 19:33:58
Mihhc:
„Aha, tak teď jsem si všiml že je v tý class také float: left. Stejně ovšem princip nechápu.“ Pokud je obalující prvek plovoucí, tak to funguje podobně jako s overflow: hidden, protože zabírá místo pro vnořené plaváčky. Nic se ale nezmění na tom, že tady bude zase bez obsahu blok #CONTENT a kdyby měl nastavené pozadí, tak se nevykreslí.
|
||
| Mihhc Profil * |
#12 · Zasláno: 4. 8. 2011, 23:50:47
Poslední otázka a přestanu otravovat:
Je to vůbec k něčemu dobré? Mnohem jednodušší mi přijde vynechat .Wrapper, paddingy hodit k malým floatům a nakonec teda prázdný clear. Jinak děkuju za vysvětlení. |
||
| Davex Profil |
#13 · Zasláno: 5. 8. 2011, 21:23:08
Mihhc:
„Je to vůbec k něčemu dobré?“ Je více cest jak něčeho dosáhnout a občas není přímá cesta tím nejlepším řešením. Pokud to funguje a dává smysl, tak se nedá říct, že je to k ničemu. Třeba tím předvídavý autor řešil nějakou situaci, která může nastat. |
||
|
Časová prodleva: 13 let
|
|||
0