SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Member
    Join Date
    Jun 2007
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Background image problem with Firefox and Opera...

    Hiya, first post here. Hoping that someone can help me get out of some frustration Smiling

    My website is http://www.fakeculture.com and I am having a problem with the background image. (bg.gif) This is the problem:

    When I resize the browser window in Firefox or Opera, what happens is that the browser shifts the background image to the left, forcing it out of alignment with the rest of the page. However if the browser is maximised everything appears fine.

    I have also tested this site in IE6 and IE7 and there isn't any problem, it works perfectly fine.

    I have validated the code and it is totally fine.

    Here is my CSS code:
    /*
    Theme Name: Vertigo Enhanced
    Theme URL: http://www.briangardner.com/themes/v...ress-theme.htm
    Description: Vertigo Enhanced is a modern, 3-column Widget-ready theme created for Wordpress.
    Author: Brian Gardner
    Author URI: http://www.briangardner.com
    Version: 2.0

    The CSS, XHTML and design is released under GPL:
    http://www.opensource.org/licenses/gpl-license.php

    Changelog:
    v2.0 - 01.29.07
    First Release of Vertigo Enhanced
    */

    body {
    background: #383838 url(images/bg.gif) repeat-y;
    background-position: center;
    color: #000000;
    font-size: 12px;
    font-family: Arial, Helvetica, Sans-Serif;
    padding: 0px;
    margin: 0px 0;
    }

    #wrap {
    background: #FFFFFF;
    width: 960px;
    margin: 0px auto 0px;
    padding: 0px;
    }
    I would be ever so grateful is someone could help.

  2. #2
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,495
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi, and welcome to SitePoint!

    I answered your question on DP - try setting the background position on the background image.

  3. #3
    SitePoint Member
    Join Date
    Jun 2007
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Dan Schulz View Post
    Hi, and welcome to SitePoint!

    I answered your question on DP - try setting the background position on the background image.
    Hehe - hello again

    I have tried setting the image position - and it doesn't seem to make any difference.

    Someone else has told be that the problem is because the background image is too wide. It sure how to get around this though...

  4. #4
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,495
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If it's the width of the background image, then you will have to open a graphics program and resize it, or adjust your CSS code to fit the image.

    (Sorry, I've been staring at code all night - my eyes are starting to play tricks on me.)

  5. #5
    SitePoint Member
    Join Date
    Jul 2006
    Posts
    0
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The best way to fix this is place the image instead of in body to #content or if you want another div that wraps around everything with width at 960px.

    Additionally you didn't clear the #content properly, you need a clear:both before the </div> not after.


Bookmarks

Posting Permissions

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