| Autor | Zpráva | ||
|---|---|---|---|
| RastyAmateur Profil |
#1 · Zasláno: 17. 5. 2016, 19:55:00
Krásné odpoledne, večer...
Mám problém. Potřeboval bych, aby divy byly hezky vedle sebe. Když mám všude jednořádkový nadpis a popis, tak to jde, ale když někde zvolím delší text, vše to začne skákat... Živá ukázka První a poslední řádka - paráda. Vyrovnané, prostě krása! Ale ta mezi nima... Obecně motivaci jsem čerpal z Verticaly -> ...(like texts or links) -> It is multiple lines Děkuji, RA |
||
| Fisir Profil |
#2 · Zasláno: 17. 5. 2016, 20:22:41
Reaguji na RastyAmateura:
Myslím, že nejjednodušší by bylo tam vrazit tabulku (ukázka je opravdu jen hrubý nástřel). |
||
| RastyAmateur Profil |
#3 · Zasláno: 17. 5. 2016, 20:34:06
Fisir:
Děkuji za reakci a radu. Asi to budu muset použít, ale raději tam vložím normální tabulku... Přijde mi to přehlednější :-) |
||
| Tomáš123 Profil |
#4 · Zasláno: 17. 5. 2016, 21:12:03
RastyAmateur:
Tabuľka má obsahovať tabuľkové dáta. Vzhľad má byť definovaný v CSS. Ak sa nejedná o obsah súci do tabuľky, nemá tam tabuľka čo hľadať. Pre základne značky tabuľky v HTML existujú CSS alternatívy správajúce sa rovnako: <table> - display: table <tr> - display: table-row <td> - display: table-cell „První a poslední řádka - paráda. Vyrovnané, prostě krása! Ale ta mezi nima...“ Kde by som mal vidieť rozdiel? Všetko mám vertikálne aj horizontálne vystredené... |
||
| User Profil * |
#5 · Zasláno: 17. 5. 2016, 21:13:21
Myslím že bude stačit přidat
a.box{
vertical-align: top;
} |
||
| RastyAmateur Profil |
Tomáš123:
Děkuji za přehled, velice mi pomohl. Nemusím to tedy dělat přes tabulku :-) A nebo to (ač nechtíc) udělám pomocí JS... Ještě dotaz. Narazil jsem na článek Flexboxy, a rád bych se zeptal, jak se to pak řeší, když je nějaký nepodporující prohlížeč (např. Explorer <10). Děkuji |
||
| Tomáš123 Profil |
#7 · Zasláno: 18. 5. 2016, 19:32:29
RastyAmateur:
Vždy sa to rieši inak. Niekedy existuje alternatíva s lepšou podporou bez nutnosti upustiť z nárokov (typicky náhrada tabuľkovými hodnotami vlastnosti display), inokedy sa môže dať požiadavka vyskladať z iných vlastností.
Flexbox priniesol niekoľko možností, ktoré sa nedajú v CSS (bez znalosti doplňujúcich vlastností objektov) vôbec riešiť... Všetko by ale mal dokázať spočítať JavaScript.
Ak chceš, aby sa stránka zobrazila poriadne čo najväčšiemu množstvu užívateľov, oplatí sa hľadať alternatívne cesty k výsledku. Tak napríklad: div {
display: table; /* Použil by sa display: table. */
/* flex s prefixami */ /* Ak prehliadač pozná nejakú z hodnôt, deklaráciu aplikuje a neskôr uvedená deklarácia prebije nastavenú hodnotu table. */
display: flex; /* Ak prehliadač podporuje aj display: flex, prebije hodnotu s prefixom. */
}displayu (napr. IE7 a staršie), aplikuje pôvodnú hodnotu block. Tento „druh“ kaskády som otestoval iba v IE8. Iný starší prehliadač nemám momentálne k dispozícii.
|
||
| Bubák Profil |
#8 · Zasláno: 18. 5. 2016, 19:39:16
Tomáš123:
„Tento ‚druh‘ kaskády som otestoval iba v IE8. Iný starší prehliadač nemám momentálne k dispozícii.“ IE7 neumí tabulkové hodnoty display, info třebas v www.lupa.cz/clanky/navrat-modreho-e a v caniuse.com/#feat=css-table |
||
| Tomáš123 Profil |
Bubák:
Áno, viem, testoval som to iba s display: flex. Kaskádou som nemyslel všetky (tri) úrovne.
V tom, že sa display v prípade nepoznanej hodnoty zmení na predvolený by sa správanie prehliadačov líšiť nemalo (display sa nezmení, ani keby bol ignorovaný celý CSS súbor, pardón). Podstatou testu bolo zistiť, či prehliadač skočí hneď na predvolenú hodnotu alebo zastaví na prvej, ktorú spozná. IE8 sa zastavil. Iné prehliadače som netestoval.
|
||
| RastyAmateur Profil |
#10 · Zasláno: 19. 5. 2016, 14:51:16
Děkuji za rady, oboum :-)
|
||
|
Časová prodleva: 9 let
|
|||
0