• 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
URLS inside CSS

#1
[eluser]Unknown[/eluser]
Hello, I am quite noob to Code Igniter and while trying to port a site I have to use this framework I encountered this issue:

I have a php page which calls a css file, I ported this as specified in some C.I. help pages using:

Code:
<link href="<?php echo base_url()?>css/drop-down-menu.css" type="text/css" rel="stylesheet" />

However, inside the file drop-down-menu.css I've got a style spec like this:

Code:
#nav a.main {    
      background:url("images/tableft2.png") no-repeat left top;
      margin:0;
      padding:0 5px 0px 1px;    
      text-decoration:none;
      width:7em;
      }

I tried adding the same "<?php echo base_url()?>" to the "images/tableft2.png" url style, however, as I expected, PHP won't parse it.

My question therefore is, how would you solve this? aside of hard-coding the page URL in the style (using
Code:
url("mysite.com/images/tableft2.png")
). Is it possible to get the base dynamically?

#2
[eluser]xwero[/eluser]
it's possible if you put your css code in a php file.
Code:
<link href="<?php echo base_url()?>css/drop-down-menu.php" type="text/css" rel="stylesheet" />
// in the file
#nav a.main {    
      background:url("<?php echo base_url()?>images/tableft2.png") no-repeat left top;
      margin:0;
      padding:0 5px 0px 1px;    
      text-decoration:none;
      width:7em;
      }

Css isn't a dynamic language. In xhtml 2 you can add a src attribute to all elements which moves the images out the css files.

#3
[eluser]Seppo[/eluser]
The CSS code URLs are relative to the css directory.

So, if your structure is like this
Quote:-- system
-- css
---- drop-down-menu.css
-- images
---- tableft2.png
...

You should set the css form the css folder to the image file
Code:
background:url("../images/tableft2.png") no-repeat left top;

#4
[eluser]sandwormusmc[/eluser]
I put my main css into a CI view, then loaded that. That way I can access all of the CI internals from within that view/css for setting the base url (forgot what they are at the moment...).

#5
[eluser]m4rw3r[/eluser]
@sandwormusmc: If you do so, then you would circumvent the browser caching that normally occurs when a css file is loaded (I take you include the css in the HTML sent to the browser and the css isn't a separate action in the controller, right?), which causes the css to get reloaded for every page request.
Why not relative URLConfused in the CSS?


Digg   Delicious   Reddit   Facebook   Twitter   StumbleUpon  


  Theme © 2014 iAndrew  
Powered By MyBB, © 2002-2019 MyBB Group.