By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
438,879 Members | 1,859 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 438,879 IT Pros & Developers. It's quick & easy.

IE6/IE7 Sliding Door Issue

P: n/a
I have an issue trying to create a tab effect (not for a naviagtion -
just for a heading).

http://001.e-connected.com/sectors/

Each of the 'work examples' tabs in IE6 and IE7 shows the line of the
background image of the div below it.

Creating a negative margin on the 'work examples' tab merely slides the
tab further behind the background image above it.

This is however working fine in all other browsers.
CSS (line 1209):
..sectorWorkExamples{
clear: left;
padding: 5px;
height: 6.75em;
background: url( /interface/pages/sectors/work_examples.gif )
no-repeat top center;
}

..sectorWorkExamples img{
float: left;
margin-right: 5px;
}

..sectorWorkExamples div{
margin: 0 0 10px 0;
}

#sectorsHolder h3{
float: left;
font-size: 1.1em;
color: #fff;
padding: 8px 12px 2px 0; /* IE and FF */
margin: 10px 0 -1px 0;
}

#sectorsHolder h3 .h3Left{
padding: 8px 0 2px 12px;
}
Background images are applied using id's for each column eg:
`
#publicSocial h3{
background: url( /interface/pages/sectors/public_social_h3_right.png )
no-repeat top right #77ae99;
}

#publicSocial h3 .h3Left{
background: url( /interface/pages/sectors/public_social_h3_left.png )
no-repeat top left;
}

Can anyone shed any light on this?

Regards,

Rick

Jan 13 '07 #1
Share this question for a faster answer!
Share on Google+

This discussion thread is closed

Replies have been disabled for this discussion.