Autor Zpráva
Velda
Profil
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 *
float:left
Velda
Profil
Manny, Manny:
nechci je mít pod sebou říkám :)
Petr ZZZ
Profil
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
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
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
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
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
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
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
Petr ZZZ:
Máš vážné nedostatky vlastnosti display :) lépe si to prostuduj ty :)
panther
Profil
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 *
<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
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
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
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
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
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 :)

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: