Horizontálne posúvanie
Príklady kódu
horizontálne posúvanie html
<div class="scrolling-wrapper">
<div class="card"><h2>Card</h2></div>
<div class="card"><h2>Card</h2></div>
<div class="card"><h2>Card</h2></div>
<div class="card"><h2>Card</h2></div>
<div class="card"><h2>Card</h2></div>
<div class="card"><h2>Card</h2></div>
<div class="card"><h2>Card</h2></div>
<div class="card"><h2>Card</h2></div>
<div class="card"><h2>Card</h2></div>
</div>
.scrolling-wrapper {
overflow-x: scroll;
overflow-y: hidden;
white-space: nowrap;
.card {
display: inline-block;
}
}ako urobiť div rolovateľné horizontálne
overflow-x: auto(show when needed) or hidden(never) or scroll(always scroll);horizontálne posúvanie
.scrolling-wrapper-flexbox { display: flex; flex-wrap: nowrap; overflow-x: auto; .card { flex: 0 0 auto; }}horizontálne posúvanie css
.scroll{
overflow-x: scroll;
overflow-y: hidden;
height: 80px;
white-space:nowrap
}horizontálne menu rolovanie slabnúť hrany
.navbar
float: left
height: 40px
min-width: 100%
display: flex
flex-wrap: wrap
.navbar-item
padding: 13px 0px
font-size: 12px
line-height: 14px
text-transform: uppercase
display: inline-block
float: left
margin: 0px 10px
&.active
padding: 13px 0px 11px 0px
border-bottom: 2px solid $light-blue
&:hover
cursor: pointer
a
color: $dark-grey
font-weight: 600
text-decoration: nonePodobné stránky
Podobné stránky s príkladmi
V iných jazykoch
Táto stránka je v iných jazykoch
empty row
Русский
..................................................................................................................
English
..................................................................................................................
Italiano
..................................................................................................................
Polski
..................................................................................................................
Română
..................................................................................................................
한국어
..................................................................................................................
हिन्दी
..................................................................................................................
Français
..................................................................................................................
Türk
..................................................................................................................
Česk
..................................................................................................................
Português
..................................................................................................................
ไทย
..................................................................................................................
中文
..................................................................................................................
Español
..................................................................................................................
Балгарскі
..................................................................................................................
Íslensk
..................................................................................................................
Populárne v tejto kategórii
Populárne stránky s príkladmi v kategórii
empty row