[CSS] Image jako tło dla trzech kolumn Opcje

[lonek]

Witam,

Mam problem z ustawieniem gif'a jako tła dla trzech kolumn, które ujęte są dodatkowo w divie wrapperze. W IE7 strona wygląda dobrze, ale w Firefoxie tło nie wyświetla się prawidłowo. Co nie wygląda okej można zobaczyć tutaj: http://sv.pl/terra/

A to kod:

Kod

body {
    margin: 0;
    padding: 0;
    height:100%;    
}

.rounded_top {
    width: 1000px;
    height: 111px;
    margin: 0px auto;
    background: url(../images/rounded_top.gif) no-repeat top center;    
}

.main_wrapper {
    width: 1000px;
    height: 100%;
    position: relative;
    margin: 0 auto;
    background: url(../images/page_bg.gif) repeat-y top center;
    /*background: #ccc;*/
}

.main_container {
    width: 960px;
    margin: -60px 0px 0px 20px;
    /*background: #65bac7;*/
}

.pageclose {
    width: 1000px;
    height: 36px;
    margin: 0 auto;
    clear: both;
    background: url(../images/page_close.gif) no-repeat top;
}

#content_left {
    display:inline;
    width:221px;
    float:left;
    /*background: #cc00cc;*/
    padding-right: 9px;
}

#content_center {
    display:inline;
    width:516px;
    *width: 500px;
    padding: 0 11px 0 11px;
    *padding: 0 23px 0 8px;
    margin: 0px 0 0px 0;
    border-left: 1px solid #d6d6d6;
    border-right: 1px solid #d6d6d6;    
    float:left;
    text-align: left;
    /*background: #cba444;*/
}

#content_right {
    display:inline;
    width:181px;
    padding-left: 9px;
    float:right;
    /* background: #09921a; */
}

i HTML:

[HTML] pobierz, plaintext 
<div class="rounded_top">	
</div>      
 
<div class="main_wrapper">
 
	<div class="main_container">
 
		<div id="content_left">
			<p>Content.</p>
			<p>Content.</p>
			<p>Content.</p>
			<p>Content.</p>
			<p>Content.</p>
			<p>Content.</p>
			<p>Content.</p>
			<p>Content.</p>
			<p>Content.</p>																								
		</div>
 
        <div id="content_center">
			<p>Content.</p> 
        </div><!--end content_center-->
 
		<div id="content_right">
			<p>Content.</p>
		</div>
 
	</div><!--end main_container-->
 
</div><!--end main_wrapper-->
 
<div class="pageclose">
</div>
 
<div class="clear"></div>
[HTML] pobierz, plaintext 

Link jeszcze raz:

http://sv.pl/terra/

Będę wdzięczny za wszelką pomoc, nie mogę się doszukać błędu..

[wookieb]

Kod

<div class="main_wrapper">
    
    <div class="main_container">
        
        <div id="content_left">
            <p>Content.</p>
            <p>Content.</p>
            <p>Content.</p>
            <p>Content.</p>
            <p>Content.</p>
            <p>Content.</p>
            <p>Content.</p>
            <p>Content.</p>
            <p>Content.</p>                                                                                                
        </div>
    
        <div id="content_center">
            <p>Content.</p>
        </div><!--end content_center-->
        
        <div id="content_right">
            <p>Content.</p>
        </div>
                
    </div><!--end main_container-->
    <div style="clear:both;"></div>
</div>

A najważniejsze to <div style="clear:both;"></div>
na http://kurs.browsehappy.pl znajdziesz duzo ciekawych ifnormacjo na ten temat.

Ten post edytował wookieb 11.09.2008, 10:20:05

[lonek]

No właśnie.. dzięki.