html - CSS: How to center element that is bigger then the container? -
I have an element of 800px and the container is small (it is responsive so that the width is changing), I have such a code :
& lt; Div id = "container" & gt; & Lt; Div id = "popup" & gt; & Lt; / Div & gt; & Lt; / Div & gt; and CSS:
# container {width: 400px; Status: Relative; } #popup {width: 800px; Status: Completed; } I tried left: 0, right: 0, margin: auto; But it is not working Box is aligned to the left. / P> here
You can use margin-left: - ( Half width) PX and left: 50% Then your code popup css code will look like this:
#popup {position : Absolute; Width: 300px; Background-color: # 0a; Height: 20px; Top: 100px; Left: 50%; Margin-left: -150px; Z-index: 100; }
Comments
Post a Comment