| Autor | Zpráva | ||
|---|---|---|---|
| DeadMan Profil |
#1 · Zasláno: 3. 6. 2008, 19:59:54
Je to hodně pitomý dotaz, ale já už se s tím trápím přes 2 hodiny. Jak mohu udělat dva DIVy vedle sebe, ale aby byli zarovnány na střed.
|
||
| Měsíček Profil |
#2 · Zasláno: 3. 6. 2008, 20:00:07
float, margin ...
|
||
| lordfrikk Profil |
#3 · Zasláno: 3. 6. 2008, 20:03:49
^ Výborná rada!
|
||
| DeadMan Profil |
#4 · Zasláno: 3. 6. 2008, 20:21:56
Ta moje pitomá hlava to nepobrala. Nějak se s tím peru a stejně to nejde. Potřeboval bych příklad. Dva DIVy, které budou vedle sebe a zarovnány na prostředek. Děkuji.
|
||
| Str4wberry Profil |
#5 · Zasláno: 3. 6. 2008, 20:30:15
Takže si najdeš návod pro centrování stránky, dovnitř centrovaného obsahu vložíš <div>y s float a width.
|
||
| jxj Profil * |
#6 · Zasláno: 3. 6. 2008, 20:35:30
Moc tomu nerozumím ale snad to tak je: Pro ty dva divy nastavíš pravidlo float: left
A pokud jej chceš zarovnat na střed tak oba divy obal do dalšího divu a tomu nastavíš margin: auto, potom pro body text-align: center a ještě pro ten obalový div nastaviš text-align: left to pro blbé prohlížeče. asi takto html:
<body>
<div id="obal">
<div id="prvni">
</div>
<div id="druhy">
</div>
</div>
</body>
css:
body {text-align: center; }
div#obal {width: 600px; text-align: left; margin: auto}
div#prvni {width: 300px; float: left; }
div#druhy {width: 300px; float: left; }
|
||
| jxj Profil * |
#7 · Zasláno: 3. 6. 2008, 20:36:13
byly jste rychlejší :D Je ten muj kod aspoň správně?
|
||
| Str4wberry Profil |
#8 · Zasláno: 3. 6. 2008, 20:43:30
Reakce na jxj:
„Je ten muj kod aspoň správně?“ Snad ano, ale byl-li by Explorer ve standardním režimu, šlo by vynechat část pro blbé prohlížeče. Měla by to teď DeadMana pochopit. |
||
| Měsíček Profil |
#9 · Zasláno: 3. 6. 2008, 20:48:48
Reaguji na jxj:
Myslím, že by to mělo býti takhle: div#obal {width: 600px; text-align: left; margin: 0px auto;} Reaguji na lordfrikka: "^ Výborná rada!" Díky, copak se ti na ni nezdá? |
||
| jxj Profil * |
#10 · Zasláno: 3. 6. 2008, 20:57:11
Měsíček: moc díky to jsem nevěděl :D
Str4wberry: aha no ja o tom četl tak to tam dávám pořád. |
||
| jxj Profil * |
#11 · Zasláno: 3. 6. 2008, 20:59:17
EDIT: Měsíček: jo vlastně aha spletl jsem se to by mi pak vlastně nastavilo i margin: auto z vrchu a zespodu což ani myslím nejde. :D
|
||
| DeadMan Profil |
#12 · Zasláno: 3. 6. 2008, 21:00:27
jxj
Díky ti moc. Problém si vyřešil. |
||
|
Časová prodleva: 7 let
|
|||
| roboter Profil * |
#13 · Zasláno: 25. 8. 2015, 15:53:10
Dobrý den,
použil jsem váš návod na pozicování dvou DIVů vedle sebe pomocí CSS vlastnosti float a třetího obalového DIVu, ale bohužel nefunguje. V obalovém DIVu nelze umístit dva vnořené divy na prostředek. Bohužel v jiných vláknech všichni radí analogicky. Děkuji za radu. |
||
| juriad Profil |
roboter:
Co znamená na prostředek? Ten postup v [#6] je již trochu zastaralý. Lze to dělat moderněji, viz Obtékání v CSS » Jednoduchý floatovaný layout.
|
||
| roboter Profil * |
#15 · Zasláno: 25. 8. 2015, 16:06:16
Měl jsem na mysli text-align:center nebo zastaralý html tag <center>... Zkusím mrknout na ten odkaz a vyzkouším... zatím moc děkuji.
|
||
| anonymníí Profil * |
#16 · Zasláno: 25. 8. 2015, 16:09:51
roboter:
Tag <center> nikde nevidím. Ten zastaralý je, ano.
Jinak ukázka z #6 funguje stále dobře, jen je možno vynechat deklaraci text-align na 1. a 2. řádku. Zbytek je stále platný a stejný postup je de facto uveden v odkazu v #14. Je možné vnitřní prvky floatovat oba vlevo (#6), nebo jeden vlevo, druhý vpravo (#14).
|
||
| roboter Profil * |
#17 · Zasláno: 25. 8. 2015, 21:16:44 · Upravil/a: roboter
Já vážně nevím.
Potřebuji ty dva letopočty dát vedle sebe, což se daří, ale nevím, proč ten první tácek začíná napravo od nich: http://www.tacky.kvalitne.cz/pivovar/blatna-blatenske-pivo/ (respektive ve Firefoxu... Chrome to zobrazuje správně, ale oba letopočty jsou vlevo, chtěl bych je uprostřed... Asi dělám nějakou hloupou chybu, ale fakt nevím...) |
||
| juriad Profil |
#18 · Zasláno: 25. 8. 2015, 21:33:39
roboter:
Protože něco co plave nejde takto jednoduše vystředit. Zruš třídě .rok vlastnost float a nastav mu display: inline-block;
A víš, že při zvětšení písma se ti to rozsype a text nebude lícovat k rámečkům nastaveným jako pozadí? |
||
|
Časová prodleva: 4 dny
|
|||
| roboter Profil * |
#19 · Zasláno: 29. 8. 2015, 14:07:49
juriad:
Děkuji za radu, už to funguje. No, vidíš, to s velikostí písma mě ani nenapadlo... Možná to nakonec udělám úplně jinak. Forma bude muset ustoupit do pozadí... Děkuji ještě jednou. |
||
|
Časová prodleva: 6 dní
|
|||
| grfgrf Profil |
<div class="obal"> <div class="obsah"></div> <div class="obsah"></div> </div> .obal {
display: flex;
width: 768px;
margin: 0 auto;
}
.obsah {
flex: 1;
}bonus: obsahy budú mať aj rovnakú výšku + keby si sa rozhodol že chceš mať 3 alebo viacej DIVov vedla seba rovnakej šírky, stačí pridať ďalší div class obsah a nemusis meniť css :)) EDIT: support: http://caniuse.com/#search=flex support 95% global fallback pre starsie browseri: http://designkarma.co.uk/blog/using-flexbox-now |
||
| Chamurappi Profil |
Reaguji na grfgrfa:
A nebo použije table a má lepší bonus v podobě výrazně lepší podpory v prohlížečích. V čem je flex lepší?
Mimochodem, odpovídáš komu? Je celkem jisté, že DeadMan flex použít nemohl.
„support 95% global“ Zbytečně málo. |
||
| grfgrf Profil |
#22 · Zasláno: 4. 9. 2015, 22:02:01
Chamurappi máš pravdu že v tomto prípade je rovnako jednoduché a s lepšou podporou použiť display table.
A reagujem na hocikoho kto bude mat podobný problém, napr sa sem niekto za rok-dva dostane cez vyhladávanie a flex už bude štandart :D |
||
|
Časová prodleva: 9 let
|
|||
0