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;}
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;
}