Jump to content

Recommended Posts

I seem to be having problems positioning my background image and colors.

body{background-color:#8e97a4;background-image:url(wi/bliner1.png);background-repeat:repeat-x; }

That is the current code. Right there in chrome and firefox, the image "blinder1.png" is normal. However, as we all know, this is just going to repeat across the top of the page from left to right. Whenever I add the following stipulation

background-position:bottom;

it seems to warp the image to a fraction of its' size, let alone not align to the "bottom" of the page. Using the left, it still warps the image but not as much. The latent function, the image warping, is really not a main issue for me right now. I am really wondering how to properly align my image across the bottom of the page. I have used the search function, and searched for about an hour or more today but I havent seen any documentation anywhere about this happening. Can anyone help?

Link to post
Share on other sites

body height is determined by content, with no content, but maybe a break in html code as in

<body> </body>

instead of

<body></body>

result in the break being the height of font-size used( if none stated reverts to 16px). therefore you must make html, and body tag the height of browser window, by using height: 100%;

body, html {margin:0; padding:0; height:100%;}body{background-color:#8e97a4;background-image:url(wi/bliner1.png);background-repeat:repeat-x;background-position: left bottom;}

  • Like 1
Link to post
Share on other sites
body height is determined by content, with no content, but maybe a break in html code as in
<body>  </body>

instead of

<body></body>

result in the break being the height of font-size used( if none stated reverts to 16px). therefore you must make html, and body tag the height of browser window, by using height: 100%;

body, html {margin:0; padding:0; height:100%;} body{background-color:#8e97a4;background-image:url(wi/bliner1.png);background-repeat:repeat-x;background-position: left bottom;}

Sir that worked. Thank you. We learn something new every day.
Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...