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-divs , 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