css - How can I keep my sub-divs from moving underneath each other when I resize the window? -
i having trouble getting divs behave way them to. below mock-up of page. page looks great, until make window smaller. @ point, sub-div b move underneath sub-div a, do not want.
how go keeping sub-div , sub-div b in line each other when window size reduced?
+--------------------------------------------------------------+ | div (container) | | +----------------------------------------------------------+ | | | div | | | +----------------------------------------------------------+ | | | | +----------------------------------------------------------+ | | | super div | | | | +------------------------+ +------------------------+ | | | | | sub-div - float left | | sub div-b - float left | | | | | +------------------------+ +------------------------+ | | | +----------------------------------------------------------+ | | | | +----------------------------------------------------------+ | | | div - clear both | | | +----------------------------------------------------------+ | | | | +----------------------------------------------------------+ | | | div - clear both | | | +----------------------------------------------------------+ | | | +--------------------------------------------------------------+
you used float
sub-div
s , definition make them wrap under each other when cannot fit on screen. make sure stay on same line, remove float
, make them both display: inline-block
, on super div
add style white-space: nowrap;
.
Comments
Post a Comment