<!-- m --><a class="postlink" href="http://conor-hastings.firewebx.com/test.html">http://conor-hastings.firewebx.com/test.html</a><!-- m -->
that is a link to my site that i am working on. The code for my header div is
#header
{
width:100%;
background:url("/images/test.gif");
}
As you can see it just loads the bg color of my container div but does not load the image?
also how do i get an image not to repeat?
and how do i get the img to center?Try removing the quotes from around the path to the image. With CSS, the only time you need to use quotes with property values is if the value contains a space. Usually with specifying font families: font-family: "Comic Sans MS", "Times New Roman", Verdana, sans;thanks ill try that, anyway to get the image to centerCheck out this page (<!-- m --><a class="postlink" href="http://www.w3schools.com/css/css_background.asp">http://www.w3schools.com/css/css_background.asp</a><!-- m -->).
To center the background, you could use something like this in your header styles:
background-position: center center;
That will center it horizontally and vertically.or you could compact it all into one definition:
background:url(/images/test.gif) center center no-repeat;This isn't related to your BG image, but something else I noticed in your code. You have the font-family declared in several of your tags in your CSS file, and they're all set to the same thing. Why not just declare it in the body, and the rest will inherit it from there? Like this:
body {
font-family: verdana, arial, sans-serif;
}
that is a link to my site that i am working on. The code for my header div is
#header
{
width:100%;
background:url("/images/test.gif");
}
As you can see it just loads the bg color of my container div but does not load the image?
also how do i get an image not to repeat?
and how do i get the img to center?Try removing the quotes from around the path to the image. With CSS, the only time you need to use quotes with property values is if the value contains a space. Usually with specifying font families: font-family: "Comic Sans MS", "Times New Roman", Verdana, sans;thanks ill try that, anyway to get the image to centerCheck out this page (<!-- m --><a class="postlink" href="http://www.w3schools.com/css/css_background.asp">http://www.w3schools.com/css/css_background.asp</a><!-- m -->).
To center the background, you could use something like this in your header styles:
background-position: center center;
That will center it horizontally and vertically.or you could compact it all into one definition:
background:url(/images/test.gif) center center no-repeat;This isn't related to your BG image, but something else I noticed in your code. You have the font-family declared in several of your tags in your CSS file, and they're all set to the same thing. Why not just declare it in the body, and the rest will inherit it from there? Like this:
body {
font-family: verdana, arial, sans-serif;
}