Problema div annidati e firefox
Ho un problema per quanto riguarda la parte grafica del mio sito ( http://harad.altervista.org ),praticamente ho revisionato un pò il css e provando le modifiche con l'ultima versione di opera sembrava tutto ok,poi provando con firefox ho notato che il background del div contenitore centrale non viene visualizzato perchè contiene a sua volta altri div.Potete vedere con vostri occhi cliccando sul link che ho postato,inoltre posto una parte del css e del template in modo che mi possiate aiutare meglio.
Parte del css:
Codice:
#maincol {
width: 760px;
background: url('../images/bg_parchment_fullwidth_720x167.gif') repeat-y top center;
color: #000;
padding: 0;
margin: 0 auto;
position: relative;
top: 0;
z-index: 10;
clear:both;
}
#topbanner {
clear:both;
padding: 0;
margin: 0 auto;
width: 760px;
height: 88px;
background:url('../images/scroll_header_760x88.gif') no-repeat top center;
position: relative;
}
#foot {
clear:both;
padding: 0;
margin: 0 auto;
width: 760px;
height: 83px;
background: url(../images/scroll_footer_760x83.gif) no-repeat;
background-position: top center;
position: relative;
}
#footext {
text-align: center;
padding: 27px 40px 0 40px;
color: #D7CAA9;
}
/* SIDECOL */
#sidecol {
width: 200px;
padding: 0;
margin: 150px 0 0 0;
float:left;
clear:left;
}
/* left margin for sidecolumn elements */
#sidecol h2,
#sidecol h3,
#sidecol ul,
#sidecol p {
margin-left: 60px;
}
#sidecol a.caption {
margin-left: 30px;
display: block;
padding: 4px 0 8px 0;
width: 160px;
text-align: center;
}
/* Wallpaper */
.screen,
.wallpaper {
padding: 0;
margin: 4px;
position: relative;
top:0;
z-index: 11;
}
.screen .thumb {
position: absolute;
top: 6px;
left: 6px;
z-index: -1;
margin: 0;
}
.wallpaper .thumb {
position: absolute;
top: 11px;
left: 11px;
z-index: -1;
margin: 0;
}
.thumbgallery {
clear: both;
/* margin-bottom: 100px;
border: 1px solid red;*/
}
.thumbgallery .screen,
.thumbgallery .wallpaper {
float: left;
margin: 18px 0;
padding: 0;
width: 150px;
}
.thumbgallery .screen p ,
.thumbgallery .wallpaper p {
margin: 0;
padding: 2px;
text-align: center;
font-size: 0.85em;
}
.thumbgallery .screen .thumb {
top: 6px;
left: 8px;
}
.thumbgallery .wallpaper .thumb {
top: 12px;
left: 12px;
}
/* Screenshots */
/* Sidebar Paper Column
e.g. used for forum topics
*/
#sidecol .papercol {
background: url(../images/sidebar_paper_tile_190x184.gif) repeat-y top left;
width: 190px;
position: relative; /* position for children */
top: 0;
margin: 125px 0 80px 0;
padding: 0;
/* border: 1px dotted green; */
}
#sidecol .papercol p {
margin: 4px 20px 4px 20px;
}
.papercol ol {
margin: 5px 10px 5px 25px;
padding: 15px 5px 2px 15px;
}
.papercol ol li {
margin-bottom: 0.5em;
}
.papercol img.paper-top {
position: absolute;
top: -72px;
left: 0;
margin: 0;
padding:0;
}
.papercol img.paper-endcap {
height: 60px;
position: absolute;
bottom: -60px;
left: 0;
}
#sidecol .papercol-bottom {
width: 190px;
position: relative;
top: 0;
left: 0;
background: url('../images/paper_bottom_bg_190x168.gif') repeat-y top left;
padding: 0;
margin: 0 0 80px 0;
/* border: 1px dotted red;*/
}
.papercol-bottom img.paper-endcap {
height: 60px;
position: absolute;
bottom: -60px;
left: 0;
}
.papercol-bottom .border-box {
width: 155px;
margin-left: 18px;
}
#midcol {
width: 450px;
margin: 0;
padding: 0;
float: left;
}
#navcol {
width: auto;
position: absolute;
right: -320px;
top: 8px;
/*margin: 0;*/
padding: 0;
}
/* "backtotop" bookmark links */
#navcol #btt-features {
position: absolute;
top: 303px;
}
#navcol #btt-awards {
position: absolute;
top: 870px;
}
#navcol #btt-gallery {
position: absolute;
top: 1500px;
}
/* navigation images */
#navcol img {
margin-top: 4px;
}
#content {
width: 450px;
padding: 130px 0 30px 0;
position: relative;
margin: 0;
}
#content p.copy {
margin: 1.5em 1.5em 2em 1.5em;
}
Parte del Template:
Codice:
<div id="maincol">
<center><img src="<?php get_theme_url(); ?>/themes/dragonage/default/images/bannerblacksmith.jpg"></center>
<div id="buttons"><a href="http://harad.altervista.org"><img src="<?php get_theme_url(); ?>/themes/dragonage/default/images/rnav_home_110x56.gif"></a></div>
<!-- SIDE COLUMN (sidebar) -->
<div id="sidecol">
<div class="papercol">
<img src="<?php get_theme_url(); ?>/themes/dragonage/default/images/sidebar_paper_top_latestforumtopics_190x72.gif" width="190" height="72" alt="" class="paper-top" />
<?php get_navigation(return_page_slug()); ?>
<img src="<?php get_theme_url(); ?>/themes/dragonage/default/images/paper_bottom_largeendcap_190x60.gif" width="190" height="60" alt="" class="paper-endcap" />
</div>
</div> <!-- chiusura div sidecol -->
<!-- MIDDLE COLUMN -->
<div id="midcol">
<div id="navcol">
<div id="count">
<!-- Histats.com START -->
<script type="text/javascript" language="javascript">
var s_sid = 41895;var st_dominio = 4;
var cimg = 406;var cwi =165;var che =100;
</script>
<script type="text/javascript" language="javascript" src="http://s10.histats.com/js9.js"></script>
<noscript><a href="http://www.histats.com/it/" target="_blank">
<img src="http://s4.histats.com/stats/0.gif?41895&1" alt="javascript hit counter" border="0"></a>
</noscript>
<!-- Histats.com END -->
<div id="firefox">
<!-- Firefox -->
<a href='http://www.mozilla.com?from=sfx&uid=0&t=561'><img src='http://sfx-images.mozilla.org/firefox/3.6/125x125.png' alt='Spread Firefox Affiliate Button' border='0' /></a></div>
<div id="facebook"></div>
</div>
</div> <!-- chiusura div navcol -->
<!-- testo della pagina -->
<div id="content">
<?php
get_page_title();
get_page_content();
?>
</div>
</div>
</div>
in breve
Codice:
maincol
|- sidecol
|- midcol
| |- navcol
| |-count
| |-firefox
| |-facebook
|-content
