hi , my background image is not showing up in firefox. the image is
compressed_background.gif inside "container" div.any help greatly appreciated, i definitely couldnt figure this one out. so any help appreciated!
thanks. derek
here is the page im talking about
http://derekvanderven.com/flower_events/home.html
here is the css to the page
Code:
@charset "utf-8";
/* CSS Document */
body {
margin: 0; /* clear for browsers */
padding: 0;
background-color: #ffffff;
font-family: "Times New Roman" Times, Serif;
}
#container {
background-image: url(compressed_background.gif);
background-repeat: no-repeat;
margin:20px auto 0 auto;
width: 750px;
}
#navigation {
margin: 0 auto 0 auto;
width: 750px;
height: 27px;
}
#homelink {
margin: 20px auto 0 auto;
width: 281px;
height: 60px;
}
#contentblock {
float: left;
width: 280px;
height: 325px;
margin-top: 65px;
margin-left: 65px;
overflow-x: hidden;
}
#flashblock {
float: right;
width: 280px;
height: 325px;
margin-top: 65px;
margin-right: 65px;
}
#textblock {
float:right
width: 200px;
height: 325px;
margin-top: 65px;
margin-left: 0px;
width: 275px;
float: right;
margin-right: 50px;
}
#textblock p {
text-indent: 10px;
}
#scrolltextblock {
float: right;
width: 280px;
height: 325px;
margin-top: 65px;
margin-right: 65px;
overflow: scroll;
overflow-x: hidden;
}
#scrolltextblock p{
text-indent: 10px;
}
#footer {
float: left;
margin-top: 50px;
margin-left: 160px;
width: 400px;
height: 25px;
text-align: center;
color: #333333;
font-weight: bold;
}
/*************************************************************************/
/*****************************************DROPDOWN MENU CODE********/
/*
Title: Vertical CSS menu with a behavior file.
Author: Stefan Vervoort
Blog: http://www.divitodesign.com/blog/
Article: http://www.divitodesign.com/blog/2008/01/vertical-css-menu-with-a-behavior-file/
*/
body {
behavior: url(csshover.htc);
}
p a {
color: #887388; /* made the link text red again */
text-decoration:none;!important;
font-size:20px; /*change size of nav and dropdown text*/
font-family:Arial, Helvetica, sans-serif;
}
a{
color:#fff;
text-decoration:none; /* text color */
}
p a:hover{ text-decoration: none!important;
}
ul#nav {
list-style: none;
padding: 0;
margin: 0;
}
ul#nav li a {
display: block;
font-weight: bold; /*background color */
padding: 2px 4px;
background-color: #887388;
}
ul#nav li a:hover{
color:#fff; /* text hover */
background-color: #887388;
}
ul#nav li {
float: left;
position: relative;
width: 105px; /* change width of boxes */
text-align: center;
margin-right:0px;
border:1px solid #ccc;
background-color: #887388;
}
ul#nav li.current a{
background-color: #887388; /* fixed the home red button to gray */
}
ul#nav li.current a:hover{
background:#887388; /* background hover */
}
li ul {
display: none;
position: absolute;
width:120px; /* width of dropdown menu */
top: 0;
left: 0;
font-weight: normal;
padding: 1px 0 10px 0;
margin-left:-1px;
}
ul#nav li ul.sub li{
border-width:0 1px 1px 1px!important;
}
ul#nav li ul.sub li a{
font-weight: normal!important;
}
li>ul {
top: auto;
left: auto;
}
li:hover ul, li.over ul {
display: block;
}
ul.sub { /* got rid of bullets in firefox */
list-style: none ;
}
/******************************************************************************************************/
/*****************************************************************************************************/
/********************IMAGE GALLERY STYLE CODE************************************************/
div.img
{
margin: 2px;
/*border: 1px solid #0000ff;*/
height: 80px;
width: 80px;
float: left;
text-align: center;
}
div.img img
{
width= 65px;
height= 65px;
display: inline;
margin: 3px;
/*border: 1px solid #ffffff;*/
}
div.img a:hover img
{
border: 1px solid #ffffff;
}
div.desc
{
float:none;
margin-left: 37px;
text-align: center;
font-style: italic;
font-weight: bold;
width: 150px;
margin-top: 30px;
margin-right: auto;
margin-bottom: 0px;
}
#img_container {
float: left;
margin-top: 60px;
margin-left: 50px;
width: 300px;
height: 325px;
padding-top: 100px;
padding-left: 25px;
}
and here is the html for the page
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<link href="flowers.css" rel="stylesheet" type="text/css">
<html xmlns="http://www.w3.org/1999/xhtml"><style type="text/css">
.style1 {color: #666666}
</style><head>
<!--[if lt IE 7]>
<link href="iefixes.css" rel="stylesheet" type="text/css" /> <![endif]-->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>flower events home</title>
</head>
<body>
<div id= "container">
<div id= "navigation">
<!-- START OF DROPDOWN MENU -->
<ul id="nav">
<li class="current"><a href="#" title="Red Flowers">Red Flowers</a>
<ul class="sub">
<li><a href="daisies.html" title="daisies">Daisies</a></li>
<li><a href="tulips.html" title="tulips">Tulips</a></li></ul>
<!-- navigation headers -->
</li>
<li class="current"><a href="yellow.html" title="Yellow Flowers">Yellow </a> <!-- navigation headers -->
</li>
<li class="current"><a href="pink.html" title="pink flowers">Pink </a> <!-- navigation headers -->
</li>
<li class="current"><a href="purple.html" title="purple flowers">Purple </a> <!-- navigation headers -->
</li>
<li class="current"><a href="orange.html" title="orange flowers">Orange </a> <!-- navigation headers -->
</li>
<li class="current"><a href="testimonials.html" title="testimonials">Testimonials</a> <!-- navigation headers -->
</li>
<li class="current"><a href="contact.html" title="contact us">Contact Us</a> <!-- navigation headers -->
</li>
</ul> <!--end of nav--><!-- END OF DROPDOWN MENU-->
</div> <!--end of navigation-->
<div id="homelink"><a href="home.html"><img src="home_link.gif" border="0" /></a> </div>
<div id= "contentblock">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent venenatis sapien ipsum, ut congue metus. Integer scelerisque sem at velit pretium congue. Maecenas lectus sapien, consectetur non lobortis nec, tempor eu leo. In ac dui ipsum, at semper nulla. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nam eget nibh arcu. Aliquam sit amet ante dui. Nam magna enim, vulputate quis pellentesque vel, tincidunt quis diam. Sed vitae lobortis diam. Phasellus turpis turpis, venenatis id blandit sit amet, malesuada a quam. Pellentesque congue ultrices dolor ut fermentum. Quisque id dolor nec eros rutrum malesuada. </p>
</div> <!-- end contentblock-->
<div id="flashblock" ><img src="new_flowers/Flores.gif" width="283"/></div>
<!-- end flashblock div -->
<div class="style1" id="footer"> Website Design by Derekvanderven.com © 2009</div>
</div>
<!--end of container-->
<!-- Start of StatCounter Code -->
<script type="text/javascript">
sc_project=3569481;
sc_invisible=1;
sc_partition=39;
sc_security="7e526e75";
</script>
<script type="text/javascript" src="http://www.statcounter.com/counter/counter.js"></script>
<p align="center"><a href="http://derekvanderven.com"></a>
<noscript><div class="statcounter"><a title="free hit counter" href="http://www.statcounter.com/free_hit_counter.html" target="_blank"><img class="statcounter" src="http://c40.statcounter.com/3569481/0/7e526e75/1/" alt="free hit counter" ></a></img></div></noscript>
<!-- End of StatCounter Code -->
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-4025495-1";
urchinTracker();
</script>
</body>
</html>
|
<---green newbie smile
<-----what its like to be a newbie
