CSS Question
Loading an text over an image without text moving when screen size changes
Every time my screen size changes the text moves on the page, i want the text to load in one set place on the image, no matter what the sceen size is. My CSS looks like this.
form {position:absolute; left: 1233px;display:inline-block;z-index:80; top: 215;}
This loads it in the correct place on the screen.
Answer Source
First of all it must be top: 215px, otherwise it's not working.
When dealing with responsive content you must use % instead of fixed px size.
form {
position: absolute;
left: 50%;
margin-left: -250px; // There must be fixed number: element width / 2
display: inline-block;
top: 10%;
z-index: 80;
}