Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 7 of 7
Like Tree1Likes
  • 1 Post By breno

Thread: css : fixed background image

  1. #1
    ooo
    ooo is offline
    Junior Member
    Join Date
    Nov 2015
    Posts
    3
    Member #
    52515

    Question css : fixed background image

    Hello,

    I am trying to set a fixed background image on a website, something similar to this:
    Rinjani - Multi-Purpose One Page Theme

    I tried using the following css:
    Code:
    #intro {
      position: relative;
      display: table;
      width: 100%;
      height: auto;
      color: #fff;
      background-image: url("romania.jpg");
      background-repeat: no-repeat;
      background-position: center center;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      background-size: cover;
      -o-background-size: cover;
    }
    which I copy and pasted from their website, and used it in the html like this:
    Code:
            <section id="intro">
            </section>
    Unfortunatly, the image does not display at all. After trying several combinations of relative urls for the image, I came here to ask for help.

  2.  

  3. #2
    Senior Member Vapr_Arts's Avatar
    Join Date
    Oct 2013
    Location
    California
    Posts
    1,930
    Member #
    37412
    Liked
    544 times
    https://css-tricks.com/perfect-full-...kground-image/

    The display:table; confuses me. Why would you set it as a table? The link above explains how to do it pretty good so no need for me to repeat what they had to say.


    Sent from my iPhone using Tapatalk

  4. #3
    ooo
    ooo is offline
    Junior Member
    Join Date
    Nov 2015
    Posts
    3
    Member #
    52515
    Thank you for your help, unfortunatly I also tried this techmique, without results.

  5. #4
    Senior Member Vapr_Arts's Avatar
    Join Date
    Oct 2013
    Location
    California
    Posts
    1,930
    Member #
    37412
    Liked
    544 times

    css : fixed background image

    Youre going to have to show us your site then. Give us a url to the site if its live or create a Jfiddle and link us to that.

    The one thing id say is to change your display from table to Inline-block. I still dont get why you put table, its not even a table.

    Sent from my iPhone using Tapatalk

  6. #5
    ooo
    ooo is offline
    Junior Member
    Join Date
    Nov 2015
    Posts
    3
    Member #
    52515
    sure, you can find it here:

    http://195.154.119.37/site/

  7. #6
    Senior Member breno's Avatar
    Join Date
    Feb 2015
    Location
    Australia
    Posts
    138
    Member #
    41574
    Liked
    29 times
    Quote Originally Posted by ooo View Post
    Hello,

    I am trying to set a fixed background image on a website, something similar to this:
    Rinjani - Multi-Purpose One Page Theme

    I tried using the following css:
    Code:
    #intro {
      position: relative;
      display: table;
      width: 100%;
      height: auto;
      color: #fff;
      background-image: url("romania.jpg");
      background-repeat: no-repeat;
      background-position: center center;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      background-size: cover;
      -o-background-size: cover;
    }
    which I copy and pasted from their website, and used it in the html like this:
    Code:
            <section id="intro">
            </section>
    Unfortunatly, the image does not display at all. After trying several combinations of relative urls for the image, I came here to ask for help.
    Try url(../romania.jpg");

    And your link does not work.
    Vapr_Arts likes this.

  8. #7
    Senior Member Vapr_Arts's Avatar
    Join Date
    Oct 2013
    Location
    California
    Posts
    1,930
    Member #
    37412
    Liked
    544 times
    That could be it. But like Breno said your link doesnt work so we cant say for sure.


    Sent from my iPhone using Tapatalk


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 10:58 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com