Aditya Dev
Aditya Dev

Reputation: 149

Text over image in css with variable position

I have a set of divs (11 of them), 8 of them with an image and 3 of them with ':'.

enter image description here

all 11 boxes are inside a class "timer". Something like this:

<div class="timer">
  <div><img></div>
  <div><img></div>
  <div>:</div>
</div>

I added text over image by using p tags inside each div and using this code on css:

.text{
position: absolute;
left: 85px;
top: 185px;
}

But on resisizing the window, the boxes move but the text stays. How can I make the text move along with the boxes?

Upvotes: 0

Views: 47

Answers (1)

mikefortuna
mikefortuna

Reputation: 59

Missing a few things here:

<div>:</div>
should actually be:
<div class="text">:</div>
if you want to apply your CSS that's targeting .text to this div containing the :.

Also if you want the container to hold the absolutely positioned element, you need to set your timer to be relative position:

.timer { position: relative; }

Upvotes: 1

Related Questions