html - Fixing center alignment with negative margin-left trick for small window -



html - Fixing center alignment with negative margin-left trick for small window -

i have div center-aligned way:

<div id="container" style="position:absolute; top:0px; left:50%; margin-left:-500px; width:1000px;"></div>

as solution trying center div horizontally , vertically in screen suggest.

the problem if client's window's width (tried in ff 15.0.1) smaller 1000px horizontal scrollbar won't allow show left side of div.

is there pure html/css way solve it?

hmm. can not resize client window. 1 thing can avoid left scroll setting width of parent div 1000px

<div id="parent" style="min-width:1000px;"> <div id="container" style="position:absolute; top:0px; left:50%; margin-left:-500px; width:1000px;"></div> </div>

note: might have set width of html , body tag min-width=100%

updated:

<html style="min-width: 100%; background-color:gray;"> <body style="min-width: 100%; background-color:white;"> <div id="parent" style="min-width: 1000px; position:relative;"> <div id="container" style="position: absolute; top: 0px; left: 50%; margin-left: -500px; width: 1000px; border: 1px solid red; height: 10px;"> 1 2 3 4 5 </div> </div> </body> </html>

i missed position:relative describe. code working.

html css

Comments

Popular posts from this blog

web services - java.lang.NoClassDefFoundError: Could not initialize class net.sf.cglib.proxy.Enhancer -

Accessing MATLAB's unicode strings from C -

javascript - mongodb won't find my schema method in nested container -