Autor | Zpráva | ||
---|---|---|---|
Velda Profil |
#1 · Zasláno: 26. 4. 2011, 00:12:16
Lze tohle provést (třeba i nějakou experimentální vlastností)? Nebo to má nějaké primitivní řešení?
<div style="width:200px"><div style="display:inline">Lorem Ipsum:</div><div style="display:inline">onec vitae arcu. Sed ac dolor sit amet purus malesuada congue. Aliquam erat volutpat. Etiam posuere lacus quis dolor. Curabitur sagittis hendrerit ante. Nullam faucibus mi quis velit. Nulla non arcu lacinia neque faucibus fringilla. Nulla accumsan, elit sit amet varius semper, nulla mauris mollis quam, tempor suscipit diam nulla vel leo. Nullam lectus justo, vulputate eget mollis sed, tempor sed magna. Etiam dui sem, fermentum vitae, sagittis id, malesuada in, quam. </div></div> Chci aby se to zobrazilo zároveň vedlo sebe, ale jako blokové elementy (aby druhý div první jen neobtékal, tj. jako 2 sloupce). |
||
Manny Profil * |
#2 · Zasláno: 26. 4. 2011, 06:50:41
float:left |
||
Velda Profil |
#3 · Zasláno: 26. 4. 2011, 11:30:07
Manny, Manny:
nechci je mít pod sebou říkám :) |
||
Petr ZZZ Profil |
#4 · Zasláno: 26. 4. 2011, 12:38:02
Velda:
Chceš-li mít variabilní šířku bloků, musíš jim zadat šířky v procentech. Skládají-li se obtékané bloky pod sebe místo vedle sebe, jsou asi příliš široké a proto se nevejdou vedle sebe do příliš úzkého rodiče. Neplechu může dělat taky nějaké příliš dlouhé slovo, pokud je delší než dovoluje šířka bloku. Doporučuji nastudovat obtékání (a nezapomeň na čistič). |
||
Velda Profil |
#5 · Zasláno: 26. 4. 2011, 12:43:24
Petr ZZZ:
já vím jak to funguje... ptal jsem se jen, jestli by šlo aby byli dva divy vedle sebe, tím způsobem, že ten druhý si nastaví šířku podle toho prvního, který má variabilní rozměry a jelikož mi přišlo, že nic takového není, tak jestli není něco takového jako experimentální CSS vlastnost, kterých si myslím v Mozille nebo v Opeře vymýšlejí dost :) |
||
Petr ZZZ Profil |
#6 · Zasláno: 26. 4. 2011, 14:08:25
Velda:
„jelikož mi přišlo, že nic takového není...“ Je. CSS: .vlevo { width:30%; float:left; } .vpravo { width:70%; float:right; } .clear { clear:both; } HTML: <div class="vlevo"> <p>1. odstavec <p>2. odstavec </div> <div class="vpravo"> <p>3. odstavec <p>4. odstavec </div> <p class="clear">5. odstavec |
||
Velda Profil |
#7 · Zasláno: 26. 4. 2011, 18:13:21
Petr ZZZ:
že ten druhý si nastaví šířku podle toho prvního, který má variabilní rozměry z předchozího příspěvku :) nemá to mít fixní rozměry, pokdu by to mělo fixní rozměry, ztrácí tento dotaz smysl :) |
||
Petr ZZZ Profil |
#8 · Zasláno: 26. 4. 2011, 18:44:50
Velda:
Asi nechápu dotaz, možná to pochopí někdo jiný. Jinak div je blokový prvek, v řádku nemá co dělat, už nadpis vlákna je sám o sobě protiklad: Přizpůsobení šířky divu volnému prostoru na řádku.
|
||
Velda Profil |
#9 · Zasláno: 26. 4. 2011, 18:47:53
Petr ZZZ:
div je blokový element jen dokud mu nenastavíme, že blokový element není :) tím řádkem jsem myslel, že maj být jako vedle sebe... nvm jak jinak jsem to měl říct... asi nic nepořídím, jak to tak vypadá :( |
||
Petr ZZZ Profil |
#10 · Zasláno: 26. 4. 2011, 19:10:48
Jako element, který se chová jako blok, má rozměry a přitom se dá napsat do řádku, mě napadá jen
<img> . Podívej se na Medvídkův odkaz v tomto vláknu: Riadkovanie <span>. Nevím, jak řádkovému prvku přidělit šířku, aniž bych z něj udělal blok. Jinak jsem s rozumem v koncích, ale třeba někdo ještě nějaké řešení dodá. Možná by pomohlo, kdyby ses pokusil svůj dotaz napsat tak, aby šel pochopit. :-)
|
||
Velda Profil |
#11 · Zasláno: 26. 4. 2011, 19:25:40
Petr ZZZ:
Máš vážné nedostatky vlastnosti display :) lépe si to prostuduj ty :) |
||
panther Profil |
#12 · Zasláno: 26. 4. 2011, 19:36:27
Petr ZZZ:
Petře, opět je tě tu plné vlákno, ale totálně mimo. Pravděpodobně jsi nepochopil zadání (které je napsané celkem dobře). Příspěvkem č. [#4] se snažíš podstrčit nastavené šířky, přestože jsou výslovně nechtěné. Příspěvkem č. [#6] opakuješ totéž. Příspěvkem č. [#8] máš částečně pravdu - ale ať div, nebo cokoliv jiného, blokové prvky se chovají podobně. Příspěvek č. [#10] je totálně mimo. Velda: „jestli není něco takového jako experimentální CSS vlastnost, kterých si myslím v Mozille nebo v Opeře vymýšlejí dost :)“ k čemu bude řešení, které bude fungovat jen někomu? Chování, které popisuješ, je vlastní tabulkám. Bez tabulky toto lze nasimulovat vlastností display s tabulkovými hodnotami. |
||
Stano Profil * |
#13 · Zasláno: 26. 4. 2011, 19:55:56
<div style="float: left; height: 100%">Lorem Ipsum:</div> <div>onec vitae arcu. Sed ac dolor sit amet purus malesuada congue. Aliquam erat volutpat. Etiam posuere lacus quis dolor. Curabitur sagittis hendrerit ante. Nullam faucibus mi quis velit. Nulla non arcu lacinia neque faucibus fringilla. Nulla accumsan, elit sit amet varius semper, nulla mauris mollis quam, tempor suscipit diam nulla vel leo. Nullam lectus justo, vulputate eget mollis sed, tempor sed magna. Etiam dui sem, fermentum vitae, sagittis id, malesuada in, quam.:</div> |
||
Velda Profil |
#14 · Zasláno: 26. 4. 2011, 19:57:37
panther:
Dík! :) Normálně bych to dal bez vykříčníku, ale jsi můj zachránce, už jsem myslel, že se tu v tomhle vlákně nikod nechytne... :) Je jasný, že tabulkou by to šlo :) ale display s tabulkovými hodnotami mě nenapadl :) k čemu bude řešení, které bude fungovat jen někomu? Tam kde to potřebuji je IE marginální záležitost a jemu nebo těm rpohlížečům, co y to neuměli by se prostě ta šířka nějaká nastavila, aby to fungovalo. Ale má to orpavdu to jednoduché řešené tabulkové...: <div style="width:200px;display:table"><div style="display:table-cell">Lorem Ipsum:</div <div style="display:table-cell">onec vitae arcu. Sed ac dolor sit amet purus malesuada congue. Aliquam erat volutpat. Etiam posuere lacus quis dolor. Curabitur sagittis hendrerit ante. Nullam faucibus mi quis velit. Nulla non arcu lacinia neque faucibus fringilla. Nulla accumsan, elit sit amet varius semper, nulla mauris mollis quam, tempor suscipit diam nulla vel leo. Nullam lectus justo, vulputate eget mollis sed, tempor sed magna. Etiam dui sem, fermentum vitae, sagittis id, malesuada in, quam. </div </div> |
||
Petr ZZZ Profil |
#15 · Zasláno: 26. 4. 2011, 20:08:23
panther:
Nenapadlo mě, že se ptá na tabulky a nějak mi uniká smysl snahy simulovat tabulky pomocí display:table . To je jen proto, aby mohl autor říct, že má web bez tabulek, nebo to má i nějaký praktický význam? Nic, jestli si myslíš, že jsem to zde zaplevelil, smaž co uznáš za vhodné.
|
||
panther Profil |
#16 · Zasláno: 26. 4. 2011, 20:09:03 · Upravil/a: panther
Velda:
nevím, o jaká data se jedná - pokud jsou alespoň trochu tabulková a má to fungovat všude, dej tam tabulku. Petr ZZZ: neptá se na tabulky, alespoň ne přímo. Tabulkových hodnot vlasntosti display se dá využít i v jiných případech, například zde.
Mazat to nebudu - třeba někomu, kdo bude tápat v základech, se to bude hodit. |
||
joe Profil |
#17 · Zasláno: 26. 4. 2011, 20:22:55
Velda:
„Chci aby se to zobrazilo zároveň vedlo sebe, ale jako blokové elementy“ Tzn. že chceš tabulku, není důvod to tabulkou neudělat. Vlastnost display s hodnotou table/table-cell/table-row zase nefunguje všude. |
||
Velda Profil |
#18 · Zasláno: 26. 4. 2011, 20:55:01
joe:
ale změnil jsem trošku svou filozofii a říkám si, že když to nejsou tabulková data, tak tam cpát tabulku nebudu :) |
||
Časová prodleva: 13 let
|
0