html - css weird margin -


does know why in example

the inner <div> displayed vertically instead of horizontally?

i use chrome element inspect can see huge margin area on right of each <div>, without margin value.

found example

could answer question, too. in case needs it.

it happens because using block layout each inner div (display:block default div elements). instead should use (for example ) display:inline-block , reduce width (to 33% in example) adds pixels spacing between 3 inner divs :

.cols_section > div{    display:inline-block; } 

example

another option use table layout, don't have change width each inner div:

.cols_section {    display:table;    width:100%; }  .cols_section > div{    display:table-cell; } 

example


Comments

Popular posts from this blog

database - VFP Grid + SQL server 2008 - grid not showing correctly -

jquery - Set jPicker field to empty value -

.htaccess - htaccess convert request to clean url and add slash at the end of the url -