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; } 

jsfiddle demo.

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; } 

second jsfiddle demo.


Comments

Popular posts from this blog

java.util.scanner - How to read and add only numbers to array from a text file -

rewrite - Trouble with Wordpress multiple custom querystrings -