Position Absolute when resizing window overlaps
newbie
Posted: Thu, 2008-07-24 19:10
Hello!!
My 1st post here, hope you understand my question. 
#1 - I've two tabs: "Web" and "Illustration".
#2 - When you enter the site the Web Information is show,so Web tab is active.
#3 - I used two divs, Web is display, Illustration is hidden, only display when clicking in tab Illustration.
Here is the CSS:
#contentweb {
width: 710px;
height: 170px;
background: url("webdesignimg/ilustrasquare.gif") repeat;
padding: 15px;
text-align:left;
position:absolute;
top: 137px;
left: 134px;
}
#contentilustra {
width: 710px;
height: 170px;
background: url("webdesignimg/ilustrasquare.gif") repeat;
padding: 15px;
text-align:left;
position:absolute;
top: 137px;
left: 134px;
}
.tab a {
width: 136px;
height:25px;
margin-right: 10px;
margin-top: 10px;
padding: 5px;
color:#ffffff;
text-decoration:none;
background: url("webdesignimg/ilustrasquare.gif") repeat;
float:left;
}
So, what's the problem?
When I resized the window, the divs are overlapping 
Do you need the HTML code?
Thank you for any help!! 
Enthusiast
Posts: 70
Joined: 2007-01-20
Location: Dallas Texas USA
Send a link to your page, if
Posted: Thu, 2008-07-24 22:24
Send a link to your page, if possible...
if not, send the html code. Most here would want to see something. You get better response in any support forum when you are specific and make it as easy as possible on the respondent.
Jack A
newbie
Posts: 5
Joined: 2008-07-24
The example is here : )
Posted: Fri, 2008-07-25 08:57
Hi!!
Example here
Thanks!
Guru
Posts: 2528
Joined: 2005-12-14
Location: Victoria British Columbia
Things are behaving just as
Posted: Fri, 2008-07-25 13:04
Things are behaving just as I would expect if you are using AP for that layout. AP is not necessary, and should be avoided for simple, layouts like that.
Absolutely positioned elements are taken out of the normal flow and are supposed to "ignore" the behaviour of all other elements. Stick with the natural flow of elements as much as possible and avoid AP except for special effects, and you better understand how they work fully before you do even that.
I could change my plea to guilty,
but I don't think it would stick.
Ed Seedhouse
newbie
Posts: 5
Joined: 2008-07-24
Hello Ed, thanks for the
Posted: Fri, 2008-07-25 14:17
Hello Ed, thanks for the reply.
I've change the CSS for this:
#contentweb { width: 710px; height: 170px; background: url("webdesignimg/ilustrasquare.gif") repeat; padding: 15px; text-align:left; } #contentilustra { width: 710px; height: 170px; background: url("webdesignimg/ilustrasquare.gif") repeat; padding: 15px; text-align:left; }I understand what is happening I just don't know how to put the same divs at the same position. One above the other.
Example
Thanks!!
newbie
Posts: 5
Joined: 2008-07-24
I duplicate a post :/
Posted: Fri, 2008-07-25 14:16
Ups... //
Guru
Posts: 2528
Joined: 2005-12-14
Location: Victoria British Columbia
I thik you should just code
Posted: Fri, 2008-07-25 15:20
I think you should just code up your content semantically and with valid html, then worry about positioning and styling later.
Right now your doctype is malformed, so technically your page isn't even actually xhtml even though it may look like it. So browsers can do pretty well anything they like with it without violating any standard. You must learn to write valid xhtml or (preferably) html if you want CSS to work.
I'm really not the guy to help you code to a predesigned layout since I'm pretty much dead set against that whole approach and think it makes lousy web pages.
You should always use a STRICT doctype for a new page.
I could change my plea to guilty,
but I don't think it would stick.
Ed Seedhouse
newbie
Posts: 5
Joined: 2008-07-24
Yeah Ed, you're right//
Posted: Fri, 2008-07-25 17:00
Yeah Ed, you're right//