html - Xbox Dashboard using CSS "Display" attribute -


i haven't used css's display attribute because tables have been sufficient after deciding practice html again trying recreate xbox dashboard. because dashboard has cells few cells big not think application tables, because div tags being used more , more feel should practice them.
leaves me how align cells on side of others such 2 on left , 1 big 1 side of them both, how can this? have tried display attribute of inline-block along combinations of loads of others different cells no success. far code only:

<div style="width: 50px; height: 50px; background-color:red;"></div> <div style="width: 50px; height: 50px; background-color:green;"></div> <div style="width: 100px; height: 100px; background-color:blue;"></div> 

use css float: property arrange divs. in case takes bit of thinking spatially it's not difficult.

for example http://jsfiddle.net/2k9tg/ in example divs black borders have no float set , divs red borders have float set to

float:left;  

so floating object, of objects float set float:left or float:right, formatted next each other (inline) rather underneath each other. xbox dashboard, gets lot more complicated, have put divs inside of divs , float of divs , others not. made jsfiddle example http://jsfiddle.net/xpagd/ check out. divs have red border can see do. hope helped out

also here's great tutorial on floating w3schools, explain better can. http://w3schools.com/css/css_float.asp


Comments

Popular posts from this blog

html5 - What is breaking my page when printing? -

html - Unable to style the color of bullets in a list -

c# - must be a non-abstract type with a public parameterless constructor in redis -