Zymic Webmaster Forums > Css Layout - Background Not Showing Up On Website

Full Version: Css Layout - Background Not Showing Up On Website

Zymic Webmaster Forums > Web Design & Development > Client Side Scripting > HTML and CSS

Finding Thunder

Jul 30 2012, 04:29 PM

Hello everyone,

I'm having a problem trying to make my big ass background to appear on my website.

Currently, I've already uploaded the image onto the server via file upload filezilla.

Pathway is the generic one that zymic gives you:
xxx/xxx/xxx/xxx/htdocs/images/image.jpg

My CSS for whole body background:

CODE

body {
        margin-left: auto;
        margin-right: auto;
        width: 50em;
        background-image:url(xxx/xxx/xxx/xxx/htdocs/images/background.jpg);
        background-size: 100%;
        background-repeat: no-repeat;
        }

My website just has the <body> tags with some words inside. I'm not going to open my website to the public, because I'm a shy person. All help on trying to help me figure this out this problem will be greatly appreciated.

In my index.php has:
<link rel="stylesheet" href="style.css" type="text/css" /> in the <head> tag.

Additional info:
I've already tired;
background:url('xxx/xx/x/xxx/'); - also with " "
background:url(xxx/x//x/xxx/x);
background-image:url('xxx/xx/x/xx/x'); - also with " "

Neither of these works.

Thanks!

zpcs

Jul 30 2012, 10:49 PM

Hi Finding Thunder,
Let's try to keep this clean and professional and drop street slang.
The advent of helpful information being withheld hinders the process and the information presented here may not be adequate to isolate the issue for remedy.

Example
My web is: http://abcd.99k.org/ (this is my web address [URL]) and it has an "images" folder which is directly off of the "ROOT" of the URL. In the "images" folder I have a image (background.jpg). I will use the "(background.jpg" to place as the background of my web at http://abcd.99k.org/.

To display the image (background.jpg) I can utilize CSS as follows:

CODE

body {
      background-image:url(http://abcd.99k.org/images/background.jpg);
      background-repeat:no-repeat;
      width: 100%;
      }

End Example

Where http://abcd.99k.org/ is equivalent to your (and replaces) xxx/xxx/xxx/xxx/htdocs/

This will get the image displayed (at its', background.jpg, image dimensions) non-repeatingly with the "body" of the web existing acrros the breadth of ones Browser, as for the rest of your coding in your POST: once you've established your background displays then experiment with your other entries.

Hope this helps you out.

Finding Thunder

Jul 31 2012, 04:16 AM

Hello zpcs,

Thank you for the explanation on using the syntax for background and its meanings.

What I had thought that you had to do first was to upload the image onto the server via FTP so that you would be able to just use it from there with just doing:

CODE

body {
background-image:url(../images/background.jpg);
}

But that didn't work for me. I am guessing the problem has got to be my pathway for the CSS to pull to display my background image onto the website.

The 'xxx/xxx/xxx/htdocs/' is the pathway to my website provided by Zymic Hosting Control Panel. I had put in a new folder inside it just to keep my images inside and up on the server.

So I don't need to use the htdocs pathway to my website but instead just have to use my website name?

zpcs

Jul 31 2012, 11:54 AM

QUOTE(Finding Thunder @ Jul 30 2012, 11:16 PM)

Hello zpcs,
.... So I don't need to use the htdocs pathway to my website but instead just have to use my website name?

Yes.
There are abbreviated methods to the "call", but, it was percieved here that it is best to learn fundamentals first.

Your Welcome and thanks for helping reinforce my knowledge and understanding.

This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.