CSS Layers affect each other?

[Ecniv]

IE6

Hi

I have a couple of layers in IE (Divs) which are at different z-indexs. All seems fine in the one view, but as soon as I put the page into a frame it changes the text size to a default (previously set). The layers are over lapping each other.

I know this is difficult to discribe and for you to understand - I was wondering whether anyone hs come across this problem before.

Vince

 

[cian]

Are the styles IN the page which is framed, or linked to an ext CSS?
Do you have a URL you could post? Or post some of the CSS?


Nollaig shona agus athbhliain faoi mhaise daoibh.
::

http://www.endamcg.com

 

[Ecniv]

Linked Css (on domino server)

//------------------\
/* Main body - default */
Body
{
color: #000000;
background: #FFFFFF none no-repeat fixed 0% 0%;
margin: 0px;
padding: 0px;

scrollbar: auto;
scrollbar-arrow-color: #aaaaaa;
scrollbar-3dlight-color:#eeeeee;
scrollbar-highlight-color:#eeeeee;
scrollbar-face-color:#FEFCFC;
scrollbar-shadow-color: #bbbbbb;
scrollbar-darkshadow-color: #000000;
scrollbar-track-color:#fefefe;

font-family: "Microsoft Sans Serif","Arial","Sans Serif";
font-size: 11pt;
font-style: normal;
font-weight: normal;

text-align: center;
}

/* Default Link colours */
a, a:link, a:visited { color: #65CBFE; text-decoration: none; font-size: 11pt; }
a:hover { color: #FFA365; }


/*
---------------------------------
Top section of Styles
---------------------------------
*/
body.topDisp
{
/* color: #ffffff;
background-color: #000000;*/
background-image: url(./layerbase.png);
background-repeat: no-repeat;
background-position: 0% 0%;
margin: 0px;

font-family: "Arial Narrow", "Arial", "Sans Serif";
font-size: 10pt;
font-style: normal;
}


/*
--------------------------------------------------
-- IDs Section Appear once -----
--------------------------------------------------
*/
#topMenuArea
{
color: #9b9b9c;
/* background-color: #aaffaa; */
background-image: url(./layermenu.png);
background-repeat: no-repeat;
width: 366px;
height: 16px;
font-family: "Plakette 5 SF", "Arial Narrow", "Arial", "Sans Serif";
font-size: 8pt;
font-style: normal;
font-weight: normal;
vertical-align: middle;
padding: 0px;
margin: 0px
overflow: hidden;
position: absolute;
left: 143px;
top: 86px;
display: block;
z-index: 3;
}

#topLogo
{
/* background-color: #ffaaaa; */
background-image: url(./layereasyads.png);
background-repeat: no-repeat;

width: 322px;
height: 55px;

z-index: 2;
overflow: hidden;

position: absolute;
left: 420px;
top: 60px;
display: block;
}

#topAdvert
{
/* background-color: #aaaaff; */
background-image: url(./layeradvert.png);
background-repeat: no-repeat;

width: 550px;
height: 60px;

border: 1px 1px 1px 1px;
border-style: dashed;
border-color: #5D7CEF;

z-index: 1;
overflow: hidden;

position: absolute;
left: 170px;
top: 2px;

display: block;
visibility: hidden;
}

/*
--------------------------------------------------
**===--- Classes Section --===**
--------------------------------------------------
*/
a.topMenu:link:active:visited { color: #9b9b9c; text-decoration: none; font-size: 9pt; }
a.topMenu:hover { color: #FDE07B; font-size: 9pt; }


\\--------------------//
Ok,
Top section has back layer (with graphic) (Body.topDisp)
Then an advert section
Then the logo
Then the menu

The logo section is either layered over or under the menu, and it seems that this is affecting the text size of the link.

Vince

 

[cian]

I presume the layers are overlapping because you have absolute positioning, maybe it's setting it from the browser window and now from the frame window.
Can you reorganise it with relative positioning? It might make a difference.
I don't have time to examine it more, if no-one else can thwen i'll take a look tomorrow.
nighty night!


Nollaig shona agus athbhliain faoi mhaise daoibh.
::

http://www.endamcg.com

 

[Ecniv]

Found the answer

a.mnuS:link, a.mnuS:visited

Although I had read in a book you can do .mnuS a:link:visited ie6 didn't like it. As soon as I did the above, it works fine.

Very weird.

Vince