Nested Divs and CSS
# May 20, 2013 at 10:48 pm
Hi, I have a div, which I linked an image in. It’s a large image and feature of the site.
I wanted to make some text overlay, and have a background color that is different.
I am using nested Divs here to try and make the effect, the text and the background color that fills the second div is overlaying on top of the image. How can I use css to make sure my div with text in it sits on top of the first div containing the image?# May 21, 2013 at 5:18 am
>I am using nested Divs here to try and make the effect
To be honest this sounds more like a structure problem than anything else.
Is there a reason you couldn’t make the large image a background image instead of being inline. I think this would simplify things greatly.
I’d like to see an link to the site or a reduced case in Codepen# May 21, 2013 at 12:49 pm
Ok, second question, which shouldn’t be hard but it doesn’t seem to be working.
You linked : [http://jsfiddle.net/nCfbe/5/](http://jsfiddle.net/nCfbe/5/ “”)
In your example you had only one span, and it worked. I want to style my lines of text differently within the span. So I thought, Ok, make multiple spans. But when I added a second span to that code you linked on jsfiddle it would only show 1 span at a time. How can I get it to show multiple ones so I can style the text differently?# May 21, 2013 at 4:00 pm
This is what I’m trying to achieve. It’s just an image in photo shop of the specific section of what we are talking about.
So, I checked out your example, and I see how you did it. I have my code setup that way now, but I noticed in practice your max width is important. It is important because it moves the text to the next line. Since I need mine to be on a new line and I need width to be 100% should I use [p] tags instead of [span] tags inside the structure you sent me wolfcry911?
note: wouldn’t let me use <> tags like in html because it interprets them.
You must be logged in to reply to this topic.