html - Horizontal website navigation -
i'm in planning stage site, needs scroll horizontally.
the simplest solution have tackle go in direction, jsfiddle.
i'm not sure if best option, have arrange each div individually i.e. left: 100%
left: 200%;
.
is there way around divs, display: inline-block
value auto wrapping viewport, don't have arrange each div individually?
removing absolute positioning
what need here remove float
, absolute positioning dividers , add white-space: nowrap
body
. dividers set display inline-block
, these affected white-space
property.
body { margin: 0; padding: 0; white-space: nowrap; } .full { width: 100%; height: 100%; display: inline-block; }
removing spaces between each block
now we've removed floats , positioning, you'll notice there white space between each divider. if refer this css tricks article, can remove giving body
font-size
of 0, , giving each divider font-size
of you're wanting font size within blocks:
body { margin: 0; padding: 0; white-space: nowrap; font-size:0; } .full { width: 100%; height: 100%; display: inline-block; font-size:16px; }
Comments
Post a Comment