3 replies [Last post]
nick04
nick04's picture
Offline
newbie
Last seen: 2 years 28 weeks ago
Timezone: GMT+5.5
Joined: 2011-10-02
Posts: 4
Points: 8

Hi Everyone!

Whenever i open my website in Internet Explorer it doesn't display grey background image behind the main navigation i.e where Overview, Download buttons are places. However the site works fine with Google Chrome and Mozilla firefox. Also whenever i open my site there is a jerky movement in navigation bar and header. So plz guys help me to get rid of these two problems.

Website Url:

http://www.pdfsecurityremoval.com

CSS Code:

CSS Code:
 
@charset "utf-8";
/* CSS Document */
 
body, ul, ol, li, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form, fieldset, label, span, em, a, img
{
border: 0;
padding: 0;
margin: 0;
}
body {
font-family: Verdana, Geneva, sans-serif;
font-size: 11px;
line-height: 20px;
color: #000;
background-color: #eeeeee;
}
a {
color: #3399cc;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
.style {
font-size: 14px;
font-weight: bold;
color: #036;
}
 
 
h1, h2, h3, h4 {
font-family: Arial, Helvetica, sans-serif;
color: #000;
}#content .title_1 {
padding-bottom: 35px;
}
#content .title_2 {
font-size: 20px;
}
 
#content .title_3 {
font-size: 18px;
}
 
#top_header {
width: 920px;
margin-left: -480px;
position: absolute;
left: 50%;
top: 0;
background-color: #FFF;
padding-right: 20px;
padding-left: 20px;
}
.center {
text-align: center;
}
 
#logo {
float: left;
padding-top: 5px;
padding-bottom: 5px;
}
#menu {
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
behavior: url(PIE.htc);
height: 36px;
background-image: url(../images/menu_image.gif);
background-repeat: repeat-x;
width: 900px;
border-right-width: 1px;
border-left-width: 1px;
border-right-style: solid;
border-left-style: solid;
border-right-color: #cccccc;
border-left-color: #cccccc;
border-top-width: 1px;
border-bottom-width: 1px;
border-top-style: solid;
border-bottom-style: solid;
border-top-color: #cccccc;
border-bottom-color: #cccccc;
padding-left: 20px;
}
#menu ul {
list-style-type: none;
}
#menu li {
display: inline;
float: left;
}
#menu a {
display: block;
padding-right: 28px;
padding-left: 28px;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-weight: bold;
color: #555;
padding-top: 8px;
padding-bottom: 8px;
background-image: url(../images/anchor_image.gif);
background-repeat: no-repeat;
background-position: right center;
}
#menu a:hover, #menu .current {
background-image: url(../images/menu_hover.gif);
background-repeat: repeat-x;
color: #FFF;
text-decoration: none;
}
/*#menu .current {
 
background-image: url(../images/current_image.gif);
background-repeat: repeat-x;
}
*/
#banner {
background-image: url(../images/banner.gif);
background-repeat: no-repeat;
height: 113px;
margin-top: 10px;
}
#breadcrum {
padding-left: 20px;
padding-top: 10px;
color: #FFF;
}
#breadcrum a {
color: #FFF;
}
#support {
float: right;
padding-top: 10px;
}
 
 
#page {
position: absolute;
width: 100%;
top: 246px;
}
#content {
width: 920px;
margin-right: auto;
margin-left: auto;
background-color: #FFF;
padding-right: 20px;
padding-left: 20px;
padding-top: 20px;
padding-bottom: 20px;
}
#content p {
padding-top: 5px;
}
 
#content .list_1 {
padding-top: 8px;
}
 
#content .read_more {
padding-top: 5px;
background-image: url(../images/bullets_1.gif);
background-repeat: no-repeat;
background-position: left 10px;
padding-left: 15px;
}
 
#top_con {
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
behavior: url(PIE.htc);
border: 1px solid #cccccc;
width: 910px;
padding-bottom: 10px;
padding-left: 10px;
position: relative;
background-image: url(../images/content_image.gif);
background-repeat: repeat-y;
padding-top: 10px;
}
 
#left {
float: left;
width: 650px;
padding-top: 10px;
padding-right: 10px;
}
#left .left_panel {
padding-bottom: 20px;
}
 
#left .para {
padding-top: 20px;
padding-bottom: 10px;
}
 
#right {
float: right;
width: 229px;
background-color: #eeeeee;
padding-left: 10px;
padding-right: 10px;
border-left-width: 1px;
border-left-style: solid;
border-left-color: #cccccc;
padding-top: 10px;
}
#right .right_panel {
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #cccccc;
padding-top: 10px;
padding-bottom: 10px;
}
#right .right_panel.end {
border-bottom-style: none;
}
 
 
#right p {
padding-top: 8px;
}
#bottom {
margin-top: 20px;
background-color: #EEE;
border: 1px solid #cccccc;
padding: 10px;
}
 
#bottom .bt_left {
float: left;
width: 195px;
background-image: url(../images/partiton_line.png);
background-repeat: no-repeat;
background-position: right center;
padding-right: 10px;
padding-left: 15px;
padding-top: 10px;
}
#bottom .bt_left.end {
background-image: none !important;
}
 
#footer {
width: 960px;
margin-right: auto;
margin-left: auto;
font-size: 10px;
padding-top: 10px;
padding-bottom: 10px;
height: 20px;
background-color: #FFF;
}
#footer a {
font-size: 10px;
}
#footer .f_lt {
float: left;
padding-left: 20px;
}
#ft_rt {
float: right;
margin-right: 20px;
}
#footer .f_lt3 {
float: left;
padding-left: 3px;
margin-top: -9px;
}
 
#footer .f_lt2 {
float: left;
padding-left: 11px;
}
#heading_1 {
font-size: 26px;
color: #FFF;
padding-top: 30px;
padding-left: 20px;
}
 
 
 
 
.image_right {
float: right;
padding-right: 5px;
padding-left: 40px;
}
.list li {
background-image: url(../images/bullets.gif);
background-repeat: no-repeat;
background-position: left 8px;
padding-left: 18px;
list-style-type: none;
}
.list_1 li {
background-image: url(../images/bullets_1.gif);
background-repeat: no-repeat;
background-position: left 7px;
padding-left: 18px;
list-style-type: none;
}
.image {
float: left;
padding-right: 5px;
padding-top: 5px;
}
 
 
 
 
 
 
 
 
 
.clear {
font-size: 0px;
line-height: 0px;
clear: both;
height: 0px;
width: 100%;
}
.tbl {
border-top-width: 1px;
border-left-width: 1px;
border-top-style: solid;
border-left-style: solid;
border-top-color: #CCCCCC;
border-left-color: #CCCCCC;
}
.tbl td {
border-right-width: 1px;
border-bottom-width: 1px;
border-right-style: solid;
border-bottom-style: solid;
border-right-color: #CCCCCC;
border-bottom-color: #F00;
padding: 7px;
text-align: center;
}
.tbl .red {
font-size: 12px;
font-weight: bold;
text-align: center;
color: #FF0000;
}
.tbl .left {
text-align: left;
}
.tbl .blue {
background-color: #C00;
color: #FFF;
}
.tbl .light_color {
background-color: #CFC;
color: #FFF;
}
.tbl .black {
color: #000000;
font-weight: bold;
background-color: #CFC;
}
.tbl .title {
font-size: 16px;
color: #FFF;
font-weight: bold;
font-family: Arial, Helvetica, sans-serif;
}.boldred {
font-size: 18px;
color: #F00;
font-weight: bold;
}

Plz help guys!

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 5 hours 11 min ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5076
Points: 2654

Hi nick04, I wonder if it is

Hi nick04,
I wonder if it is the behavior: url(PIE.htc); causing a problem with IE.
Try commenting it out to see what you get.

nick04
nick04's picture
Offline
newbie
Last seen: 2 years 28 weeks ago
Timezone: GMT+5.5
Joined: 2011-10-02
Posts: 4
Points: 8

Thanks Sir, it worked for me

Thanks Sir, it worked for me Smile Any suggestions to resolve the problem of navigation bar and header movement while opening the page?

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 5 hours 11 min ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5076
Points: 2654

I think the movement is

I think the movement is coming from the <div id="support">
If you give it a height of 110px so it has height before the image loads all should be fine.

#support{
  height:110px;
}