I am very new to coding and literally have no idea how to fix this and would really appreciate some help.
I'm creating a virtual cv; have some content that keeps on overlapping when the browser is resized and nothing I try will stop it...
I want the content to resize as the broswer resizes; if possible. But I do not want the content to overlap..
my work so far is hosted on codepen; here's the link...
this is my work http://codepen.io/JRMatthews/pen/RKWjLa
<div class='title'>
<p>Jordan Matthews</p>
</div>
That title is seemingly overlapping the writing that is below it; but I want it to stay above and not overlap; just like when the browser is full size...
please help
*****EDIT****
I also would really appreciate finding out the easiest way to centre align all of my content- as I can't seem to work out how to do it.
but the biggest issue is with the overlapping.
I can add screenshots if needed but the link to my pen on CodePen has been inserted.
PLEASE HELP. THANKS.
Try to remove absolute positioning from your elements, there are plenty ways of positioning elements exactly where you want them to be, without using position absolute.
You can use text-align or padding and margin to change text position.
Remove all occurences of position: absolute from your CSS code.