开发者

relative path not working for images in css

I have the following file structure:

C:/wamp/myproject/admin/webroot/images

I have an index.php file lying inside the admin folder which calls a header.inc.php file lying in the same folder. header.inc.php has the following code-

<td align="left" valign="top" class="header-bg">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
开发者_开发知识库

index.php calls a css file (css.css) through the following code:

<link href="<?php echo (WS_DIR_CSS); ?>/css.css" rel="stylesheet" type="text/css" />

The css lies in the following location: C:/wamp/myproject/admin/webroot/css

The css files has a class which has the following code:

.header-bg {
  background:url(../images/header_bg.jpg) left top repeat-x;
  height:77px;
}

The image header_bg.jpg is not being displayed in the browser. Help anyone?


the image is included relative to the css

if your image lives here...

/images

and your css lives here...

/somefolder/css/style.css

then the rule would be

background-image:url( ../../images/header_bg.jpg );

Can you check the element using firebug? Are there any rewrite rules that may be rerouting the request? Do you have read permissions on the image?


The image header_bg.jpg is not being displayed in the browser.

There are a hundred possible reasons: from your browser set to block images, filesystem permissions denying read-access on the server. Without knowing several more important details, a good start is figuring out if you're browser even tries to get the image. This is where Firebug (via Firefox add-ons), or some other like browser plugin comes in handy.


Look in your server logs to see which files is actually being requested. It's quite likely that you've got your URLs mixed up somewhere along the way.


Relative addressing is not working by design.
That's why one should use absolute address.

  1. Make yourself know what is actual header_bg.jpg address relative to site root.
    /images/header_bg.jpg for example.
  2. Use that address.
    With or without WS_DIR_CSS helper, but in the HTML code it must be /images/header_bg.jpg or whatever absolute address is.
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜