Válí se ti projekty v šuplíku? Dostaň je mezi lidi a získej cool tričko a body na profi IT kurzy v soutěži ITnetwork summer 2017!
Přidej si svou IT školu do profilu a najdi spolužáky zde na síti :)
Avatar
Honza Bittner
Redaktor
Avatar
Honza Bittner:2.2.2014 12:42

Mám problém, chci aby se mi na stránce zarovnávaly prvky takto

[ ][ ][ ][ ][ ][ ][ ][ ][ ][ ]
      <---->scroll

namísto

[ ][ ][ ][ ]
[ ][ ][ ][ ]

Tzn. chci nastavit roztahování stránky na horizontální namísto vertikálního.
Nějaké nápady? :P

Odpovědět 2.2.2014 12:42
Student FIT ČVUT. Sleduj mě na https://twitter.com/tenhobi a zeptat na cokoli se mě můžeš na https://github.com/HoBi/...
Avatar
Michal Doubek (HAPPY DAY):2.2.2014 12:46

buď dej:

width: auto; height: 200px;

nebo pokud chceš scrolovat

width: 100%; height: 200px; overflow: auto;

to by mělo udělat scrollování v tom elementu

Nahoru Odpovědět 2.2.2014 12:46
Svoboda tvé pěsti končí na špičce mého nosu
Avatar
Honza Bittner
Redaktor
Avatar
Odpovídá na Michal Doubek (HAPPY DAY)
Honza Bittner:2.2.2014 12:49

Pořád to scrolluje dolu, ale já potřebuji do stran... :P

Nahoru Odpovědět 2.2.2014 12:49
Student FIT ČVUT. Sleduj mě na https://twitter.com/tenhobi a zeptat na cokoli se mě můžeš na https://github.com/HoBi/...
Avatar
Michal Doubek (HAPPY DAY):2.2.2014 12:51

zkus overflow-x

Nahoru Odpovědět 2.2.2014 12:51
Svoboda tvé pěsti končí na špičce mého nosu
Avatar
done
Člen
Avatar
done:2.2.2014 12:54

Nastavil bych velikost tak aby to horizontálně přesahovalo, nastavil bych overflow-x: hidden aby uživatel nemohl scrollovat pomocí scrollbaru a pak bych využil metodu scrollLeft v jQuery. Ale nejsem si úplně jistý jestli by to šlo.

 
Nahoru Odpovědět 2.2.2014 12:54
Avatar
Honza Bittner
Redaktor
Avatar
Odpovídá na Michal Doubek (HAPPY DAY)
Honza Bittner:2.2.2014 12:54

To je úplně k ničemu, tyto overflow-x/y jen vpodstatě zobrazují lišty.

Nahoru Odpovědět 2.2.2014 12:54
Student FIT ČVUT. Sleduj mě na https://twitter.com/tenhobi a zeptat na cokoli se mě můžeš na https://github.com/HoBi/...
Avatar
Honza Bittner
Redaktor
Avatar
Odpovídá na done
Honza Bittner:2.2.2014 12:58

Nastavovat velikost staticky na třeba 10000px je blbé, může se stát někdy, že už to nebude stačit. A nastavovat šířku v JS také nebude moc výhodné.

Nahoru Odpovědět 2.2.2014 12:58
Student FIT ČVUT. Sleduj mě na https://twitter.com/tenhobi a zeptat na cokoli se mě můžeš na https://github.com/HoBi/...
Avatar
done
Člen
Avatar
Odpovídá na Honza Bittner
done:2.2.2014 13:00

Proč ne v JS ? Osobně nastavuji v JS výšku a někdy i šířku některých elementů.

 
Nahoru Odpovědět 2.2.2014 13:00
Avatar
Honza Bittner
Redaktor
Avatar
Odpovídá na done
Honza Bittner:2.2.2014 13:03

Protože když to funguje v CSS tak proč to dělat v JS? :P

Nahoru Odpovědět 2.2.2014 13:03
Student FIT ČVUT. Sleduj mě na https://twitter.com/tenhobi a zeptat na cokoli se mě můžeš na https://github.com/HoBi/...
Avatar
done
Člen
Avatar
Odpovídá na Honza Bittner
done:2.2.2014 13:05

Výška se pomocí CSS nastavuje špatně, pokud to má být responzivní. Ale kdyby jsi tu šířku udělal "šikovně", nastavil oveflow-x: hidden, tak by uživatel ani nevěděl, že to přesahuje.

 
Nahoru Odpovědět 2.2.2014 13:05
Avatar
Odpovídá na Honza Bittner
Michal Doubek (HAPPY DAY):2.2.2014 13:07

tak testováno:

<div style="width:100%; height:200px; overflow-x:scroll;">
<div style="width:auto;">ssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss
ssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss</div></div>

zkus testoval jsem na w3schools

Nahoru Odpovědět  -1 2.2.2014 13:07
Svoboda tvé pěsti končí na špičce mého nosu
Avatar
Drahomír Hanák
Tým ITnetwork
Avatar
Odpovídá na Honza Bittner
Drahomír Hanák:2.2.2014 13:08

Nehledáš white-space: nowrap; ?

EDIT: viz. ukázka http://jsfiddle.net/8E4ZS/

Editováno 2.2.2014 13:09
 
Nahoru Odpovědět  +3 2.2.2014 13:08
Avatar
Honza Bittner
Redaktor
Avatar
Odpovídá na Drahomír Hanák
Honza Bittner:2.2.2014 13:10

Jo! To je přesně ono, také jsem to zrovna objevil... :)

Nahoru Odpovědět 2.2.2014 13:10
Student FIT ČVUT. Sleduj mě na https://twitter.com/tenhobi a zeptat na cokoli se mě můžeš na https://github.com/HoBi/...
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 13 zpráv z 13.