problem with background-position

+2 Brian Dormisch · November 27, 2014
This is how I have my style section:


<style type="text/css">
body {background-image:url(sup.png);
background-repeat:no-repeat; <!--to not repeat the image-->
background-position:50% 100px;

}
p {color:red; font-family:arial; line-height:160%; text-indent:25px;}
h1 {color:#EAF643;  text-align:center;}
ol {font-weight:bold;}
ul {font-style:italic;}

</style>


The problem is that the command background-position doesn't work either with percentages nor pixels. The image is 273x400 pixels. Why is that?

Post a Reply

Replies

Oldest  Newest  Rating
+2 Doug Fresh · November 28, 2014
Try this:

<style type="text/css">
 /* Specify Background Properties; image, no-repeat, positioning. */
  body {
background-image:url(sup.png);
background-repeat:no-repeat;
background-position: 50% 100px;
  }
  p {color:red; font-family:arial; line-height:160%; text-indent:25px;}
  h1 {color:#EAF643;  text-align:center;}
  ol {font-weight:bold;}
  ul {font-style:italic;}

</style>

HTML Commenting will not work inside of a CSS Style type, only CSS Comments. These are identified by 
/* Enter CSS Comments inside these marks. End it with these marks */

If you need to use HTML code, try placing it outside, before the <Style> tags begin.
0 Brian Dormisch · November 28, 2014
Thank you! That was it.
  • 1

HTML / CSS / Web Design

107,240 followers
About

Discuss, share, ask, learn and teach HTML5 and CSS3.

Links
Moderators