Background image distorted

Taken From The Forum:
Forum Topic:
Last Updated: Saturday July 14 2012 - 06:07:33

Background image distorted - [SOLVED]

Poster: rheeskens
Dated: Friday June 8 2007 - 11:40:32 BST

I've included a milonic menu in the new design of a website. Everything works fine, except: when I open a page the background image (which is included with a css style sheet ...

body {
background-color: #006699;
background-image: url(../images/ganges820.jpg);
background-position: center top;
background-repeat: repeat-y;

}

...gets distorted. Part of it shifts to the right. However, when I scroll down the page and then scroll up again, everything looks fine.
See: http://www.globalincome.org/EnglishNew/ ... ncome.html

Can anybody help me solve this? Thanks in advance!

René

Poster: Ruth
Dated: Friday June 8 2007 - 16:48:17 BST

Hi,

I believe it's your background-position setting of center top that is causing that. What are you trying to do with that background?
Ruth

Poster: rheeskens
Dated: Friday June 8 2007 - 19:02:45 BST

Hi Ruth,

I am not sure if I understand your question correctly, but I want the background image to be centered horizontally and to be repeated vertically. Is there a better way to do this?

René

Poster: Ruth
Dated: Saturday June 9 2007 - 3:42:30 BST

Hi,

It seems to have something to do with all those Paragraph codes you have to shift the table down. I have no idea why but when I removed those it worked fine. So I tried adding a table row with those in it instead of just on the page and that seemed to work, also. This is the change I made. I also changed the css to use the shorthand, but I don't know if that had anything to do with it or not. It seemed to work either way

Code:

<BODY>
<SCRIPT src="milonic_src.js" type=text/javascript></SCRIPT>
<NOSCRIPT>
<P><A href="http://www.milonic.com/">JavaScript DHTML Menu Powered by 
Milonic</A> </P></NOSCRIPT>
<SCRIPT src="mmenudom.js" type=text/javascript></SCRIPT>
<SCRIPT src="menu_data.js" type=text/javascript></SCRIPT>
<A name=Top></A>

<TABLE cellPadding=4 width=600 border=0>
  <TBODY>
  <TR><TD><P> </P>
<P> </P>
<P> </P><P></P><P></TD></TR>
  <TR>
    <TD>
      <P><A name=AWhat></A></P>
      <H2>What is a Global Basic Income?</H2>

CSS is this. Again, I don't know that this actually had anything to do with it. I just didn't want to spend the time to change it back to the original since I tested this first

So, try the table as it is above with no changes to your css and see if that works

If not, then add the bottom css. If you still see a problem please post which browser has it.

Code:

BODY {
   BACKGROUND: #006699 url(../images/ganges820.jpg) top center repeat-y; COLOR: #000080; FONT-FAMILY: "Times New Roman", Times, serif; TEXT-ALIGN: center
}

Ruth

Poster: rheeskens
Dated: Saturday June 9 2007 - 15:53:00 BST

Hi Ruth,

Thanks a lot for your help!

I've put all the paragraph codes within the table and then everything worked fine. On other pages I had to combine separate tables by putting them into one bigger table to solve the problem.

Thanks again,
René

Industrial Strength JavaScript and DHTML Menus

Background image distorted - [SOLVED]