Need a text to remain in position even though page changes height randomly each load
I've been looking around the internet for a solution to this problem, and I haven't really found a valid solution yet. Also, I am very new at web development, so please bare with me.
I've already tried position:absolute, but it doesn't work because my pages change in size each time they load (I have random testimonials load each time the page is loaded and they differ in height, which increases/decreases the height of the page).
Here is the actual code that I tried:
<DIV style="position: absolute; top:1112px; left:20px; width:1220px; height:50px"><p align="center"><small>blah blah blah</small></p></DIV>
I am not sure if I should try using position:relative because I don't know if the random testimonials will also change the position of the DIV box that defines the text being positioned within it.
Does anyone have any solutions for me? My goal is to simply have a text directly above the footer. It should remain always direct above the footer regardless of the height/width of the page.
It's impossible to suggest a specific solution without seeing all of the code for your page and without a better description of the effect you want. You don't explain why you don't simply insert the <div> ahead of your footer code in the HTML mark-up. At the very least, you could incorporate this <div> in whatever containing element you consider to be the true footer, regardless of the actual HTML code involved, and use CSS to differentiate it visually for the user. Do you need this <div> and the footer to be visible at the bottom of the browser window regardless of the page content?
Position:absolute is the right thing to use. All you are doing wrong is setting top:1112px. Set: bottom:120px (or whatever) instead of top. I'm not sure if that is exactly the effect you want. If not, just include the div in the normal flow immediately before the footer (as already suggested). Or perhaps better still, why not make it part of the footer???