Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Aug 2011
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    background-image not displaying

    Hi all,
    I'm trying to build a personal website. My first big hurdle has been getting images to display properly with CSS. I have been unable to get a background image to appear when adding to the body element as well as specific div or in-line elements.

    I think the problem might be because I am testing the website locally on my computer. Maybe Firefox is assuming that the image is supposed to be found online from the url but even when I use the full url (file:///C/...image.gif) it does not appear.

    I am using Firefox 5.0 to preview my website. Any help/ideas would be greatly appreciated. Here is a sample of the code that I'm using:

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
    
    <html>
    
    <head>
    <title>test page</title>
    	<style type="text/css" media="screen">
    		body {
    			background-image: url(image.gif);
    		}
    	</style>
    </head>
    <body>
    
    </body>
    </html>

  • #2
    Registered User
    Join Date
    Jun 2011
    Posts
    1,063
    Thanks
    12
    Thanked 241 Times in 240 Posts
    try using a shorter method

    Code:
    background-image: url('images/image.png');
    to check if the file path is wrong, open up chrome, right click --> inspect element. Click on the url of the image (show in the picture). If an image does not appear then the file path is wrong





    you can also try body, html { min-height: 100%; }
    Last edited by Sammy12; 08-01-2011 at 08:59 PM.

  • #3
    New to the CF scene
    Join Date
    Aug 2011
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hello,

    I am having a problem with the background color on my website. It works fine in Firefox but it does not work in Internet Explorer.

    Here is the website, so you can see: www.lawyerduncan.com

    Here is the code:

    <table width="100" border="0" align="center" cellpadding="0" cellspacing="0" style="background-repeat:repeat-x; background-position:top; height:100%; background-image:url(images/til_1.jpg) ">

    Any suggestions on how to fix it so it works in Firefox and Internet Explorer?

    Thanks!

  • #4
    Registered User
    Join Date
    Jun 2011
    Posts
    1,063
    Thanks
    12
    Thanked 241 Times in 240 Posts
    post a new thread on this. it's a separate problem.

    1. background-image: url(images/til_1.jpg);"> (close the tag)

    2. Put all this in a css file

    3. use position: absolute; instead of position: fixed; on page-background

    http://validator.w3.org/check?uri=ht...Inline&group=0


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •