Insert a background image in CSS (Twitter Bootstrap)

24

How can i add a image background to my website?

body {
     margin: 0;
     background: url(background.png);
     background-size: 1440px 800px;
     background-repeat:no-repeatdisplay: compact;
     font: 13px/18px "Helvetica Neue", Helvetica, Arial, sans-serif;

I did that much but nothing shows up on my page. I'm a CSS beginner.

Updated:

body {
 margin: 0;
 background-image: url(.../img/background.jpg);
 background-size: 1440px 800px;
 background-repeat:no-repeat;
 display: compact;
 font: 13px/18px "Helvetica Neue", Helvetica, Arial, sans-serif;

This question is tagged with css twitter-bootstrap

~ Asked on 2012-06-08 16:18:44

The Best Answer is


40

Put the background url in quotes.

It should be background: url('background.png');

See here for working demo.

You also have an issue with the background-repeat line missing a semicolon in between two statements. If your background is really tiny you won't see it because of that issue.

Just to update on the solution, among the other issues, the background file was being refrenced with .../background.jpg when it should have been ../background.jpg (2 dots, not 3).

~ Answered on 2012-06-08 16:20:59


6

isn't the problem the following line is incorrect as the statement for background-repeat isn't closed before the next statement for display...

background-repeat:no-repeatdisplay: compact;

Shouldn't this be

background-repeat:no-repeat;
display: compact;

adding or removing quotes (in my experience) makes no difference if the URL is correct. Is the path to the image correct? If you give a relative path to a resource in a CSS it's relative to the CSS file, not the file including the CSS.

~ Answered on 2012-06-08 16:25:55


Most Viewed Questions: