It's as I said before. Your layout contains floated content and you
haven't cleared your floats. Adding overflow: hidden to #container will
make the borders appear in Firefox but you should do some reading up on
'clearing floats'.
On Wed, 20 Jun 2007 10:35:50 +1000, Joyce Evans
<[EMAIL PROTECTED]> wrote:
Here is the link to the incomplete home page. It's as far as I have
gotten
with the CSS. The CSS file name is brookgrooves_home.css, and it is an
external style sheet, which you'll be able to download.
http://www.nichemktghouston.com/bookgrooves/index.html
Notice that the dark lines appear to the left and the right in IE but
not in
Firefox.
This is how the design sample looks prior to my programming. This is
simply
one jpg file:
http://www.nichemktghouston.com/bookgrooves/HomePageSample17e_ltGrnTitles.ht
ml
I can't even imagine how I'm going to handle the Topic and Members
columns
with CSS, as well as the three columns for Popular Reads with the images
of
the books. It's been painful, but I'm trying not to use tables.
Nonetheless, I'm not using a border because I need to figure out how to
get
the background image to appear in Firefox. I use background images
often,
and they usually aren't as simple as a border.
Thank you.
-----Original Message-----
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On
Behalf Of John Faulds
Sent: Tuesday, June 19, 2007 7:00 PM
To: wsg@webstandardsgroup.org
Subject: Re: [WSG] Container Background Image Does Not Appear in Firefox
We need to see more of your code or a link to your page but I suspect
your
container probably contains floated content and you haven't cleared your
floats properly.
I have to ask though, if your image is just creating black borders on
either side of the container, why don't you use borders in CSS instead?
On Wed, 20 Jun 2007 09:40:15 +1000, Joyce Evans
<[EMAIL PROTECTED]> wrote:
I'm new to this group, and I'm not sure if it's okay to post a question,
but
here it is:
I've designed a website and am now creating the CSS for the home page.
This
is the CSS for my main container div:
#container {
width: 760px;
background-color: #000000;
color: #333300;
margin: 0 auto;
padding: 0;
text-align: left;
background-image: url(images/bg_container.jpg);
background-repeat: repeat-y;
}
The problem is that the bg_container.jpg image does not appear in
Mozilla
Firefox; however it appears in IE 7. bg_container.jpg is 760 px wide
with
the first pixel and the last pixel being black. All the pixels in
between
are white, thus creating a thin black border on the left and right hand
sides of the 760 px container. In the latest version of Firefox, I do
not
see these two black lines.
Could someone please advise.
Thanks!
*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
*******************************************************************
--
Tyssen Design
www.tyssendesign.com.au
Ph: (07) 3300 3303
Mb: 0405 678 590
*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
*******************************************************************
