Advanced Search

Results 1 to 7 of 7

Thread: Controlling image backgrounds

  1. #1
    Join Date
    Jan 2007
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Controlling image backgrounds

    I have created a web page and placed a photo as a background. However depending on the computer I am viewing it on, it looks different. On one, the photo takes up the entire screen. On the second larger monitor, the photo repeats. Is there a way to control this so that it looks the same on all monitors
    The site is at http://lasvegas08.vacations.jelijo.com/

  2. #2
    Join Date
    Aug 2005
    Location
    Other Side of My Monitor
    Posts
    3,486
    Thanks
    5
    Thanked 105 Times in 104 Posts
    Blog Entries
    1

    Default

    Well, if the image is smaller than the screen size it will repeat unless you use CSS and tell it not too. Or upload a larger picture.

    For CSS you can use the no-repeat option in your body style:

    Code:
    <style type="text/css">
    <!--
    body {background-image: url(images/filename.gif); background-repeat: no-repeat;}
    
    -->
    </style>
    That would go in the head section. Oh, and you only need one <body> tag
    {CWoT - Riddle } {OSTU - Psycho} {Invasion - Team}
    Follow Me on Twitter: @Negative_Chaos
    PHP Code:
    $result mysql_query("SELECT finger FROM hand WHERE id=3");
    echo 
    $result

  3. #3
    Join Date
    Jan 2007
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks
    But if I upload a larger picture and view it on a smaller monitor then you don't see the entire picture

  4. #4
    Join Date
    Aug 2005
    Location
    Other Side of My Monitor
    Posts
    3,486
    Thanks
    5
    Thanked 105 Times in 104 Posts
    Blog Entries
    1

    Default

    And thus the battle begins... The other option is to center the background image and use a well suited color or gradient as the surrounding background for larger screen monitors.
    {CWoT - Riddle } {OSTU - Psycho} {Invasion - Team}
    Follow Me on Twitter: @Negative_Chaos
    PHP Code:
    $result mysql_query("SELECT finger FROM hand WHERE id=3");
    echo 
    $result

  5. #5
    Join Date
    Jan 2007
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    So I assume there actually is no answer

  6. #6
    Join Date
    Aug 2005
    Location
    Other Side of My Monitor
    Posts
    3,486
    Thanks
    5
    Thanked 105 Times in 104 Posts
    Blog Entries
    1

    Default

    There are lots of answers, you just have to pick one. There is always "detect the res and display picture X based on that" method, the centering method I mentioned above, the smaller picture titled method, the larger picture cut off method. Lots.. just have to pick the lesser of the evils.
    {CWoT - Riddle } {OSTU - Psycho} {Invasion - Team}
    Follow Me on Twitter: @Negative_Chaos
    PHP Code:
    $result mysql_query("SELECT finger FROM hand WHERE id=3");
    echo 
    $result

  7. #7
    Join Date
    Jan 2007
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    In the end I turned the image into a watermark background so that it stays centred no matter screen size

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
  •