6 replies [Last post]
foochuck
Offline
Enthusiast
Fort Myers, FL
Last seen: 11 years 24 weeks ago
Fort Myers, FL
Timezone: GMT-5
Joined: 2003-10-15
Posts: 54
Points: 0

I have a class called .ask:

.ask {
position: relative;
z-index: 1;
top: 425px;
left: 600px;
}

I'm applying the class to this image:

img src="images/ask-about-our.png" class="ask"

I'm trying to place this image over other content on my web page.

The problem is that I'm placing this image at the top of my html document and in the space where I have placed the image in the HTML there's a blank spot.

The ask class positions the image where I want over my other content, but the spot where the image is placed originally in the html page is blank.

Does anyone know how to get rid of this blank space?

Thanks

FOO

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 31 weeks 19 hours ago
Joined: 2004-06-30
Posts: 9668
Points: 801

What happens if you give the

What happens if you give the BODY element position: relative; and use absolute instead of relative on your .ask class?

Verschwindende wrote:
  • CSS doesn't make pies

foochuck
Offline
Enthusiast
Fort Myers, FL
Last seen: 11 years 24 weeks ago
Fort Myers, FL
Timezone: GMT-5
Joined: 2003-10-15
Posts: 54
Points: 0

I will give this a try and

I will give this a try and get back to you.

foochuck
Offline
Enthusiast
Fort Myers, FL
Last seen: 11 years 24 weeks ago
Fort Myers, FL
Timezone: GMT-5
Joined: 2003-10-15
Posts: 54
Points: 0

Alright your suggestion got

Alright your suggestion got rid of my whitespace problem. However now that the image over the content is absolute it's staying in the same place. I want it to move with the page if the page is at a different size I want it to move with the page so it's over the same spot.

Currently if I resize my web browser, the image stays in place and it doesn't cover the spot I want it to cover.

foochuck
Offline
Enthusiast
Fort Myers, FL
Last seen: 11 years 24 weeks ago
Fort Myers, FL
Timezone: GMT-5
Joined: 2003-10-15
Posts: 54
Points: 0

One more thing I should

One more thing I should explain.

My page is setup with a div ( id is container ).

Container has a left and right margin of auto so that it is centered on the page.

So when the web browser is resized, container dynamically repositions itself to the center of the browser.

Using the .ask class on my image with absolute positioning doesn't allow the image to dynamically place itself over the spot in container I'm trying to cover. It looks fine when I position it to my screen resolution, but when I test it at a larger or smaller resolution it doesn't cover the same spot after container repositions itself in the center of the browser.

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 31 weeks 19 hours ago
Joined: 2004-06-30
Posts: 9668
Points: 801

Is the AP element a child of

Is the AP element a child of the container?

If so, you need to remove the relative positioning from the BODY element and apply it to your container instead.

Verschwindende wrote:
  • CSS doesn't make pies

foochuck
Offline
Enthusiast
Fort Myers, FL
Last seen: 11 years 24 weeks ago
Fort Myers, FL
Timezone: GMT-5
Joined: 2003-10-15
Posts: 54
Points: 0

That totally fixed my

That totally fixed my problem. Thank you so much.