I can’t link to css with relative path

Asked

Viewed 402 times

0

I am using Valet and my link to the css file is not working. I have this in my file /exemplo/index.php

<link rel="stylesheet" type="text/css" href="css/style.css">

The file is in /exemplo/css/style.css. The browser tries to load the file /css/style.css.

I just did one more test here and I noticed that when I access http://local.dev/example does not work. But when access http://local.dev/example/index.php works.

That makes sense, but is there any way to make it work in both? Even if it’s a php function.

php html css

  • Simple. href="exemple/css/style.css"

  • @Giovanirodrigo It’s not like that. First because the right would be href="exemple/css/style.css". Second because I don’t know the folder name. These are multiple folders. As I said, I need the path to be relative.

  • The path where PHP is located is irrelevant. What matters is the URL used to access the page. It would be good to [Edit] the question and add this information. (this all assuming that the base is not changed in HTML, which would be an extra problem)

  • @Bacco I just edited with more information. To be clear, my system creates folders with a template that has a index.php and a css/style.css. And I need it to work on every page.

  • 1

    are you sure that example/ of what doesn’t work was tested with the bar at the end? If you use PHP, wouldn’t it be the case to use path from root? Hard a real case where the person really needs relative. The relative makes a little more sense in code that third parties will use, and may be at different levels depending on the situation of each.

  • I just checked, with the bar at the end works, without the bar does not work.

  • It would be better to fix it then. Ideally, always be accessed by a single URL. For example, always forcing the bar. Or never using the bar. Having "varying" URL is bad for indexing, and other things (as you just noticed). Either use without bar and include example in the path, or use with bar and part of css/

  • Not that you can not adjust by PHP, but if it is to do this, already do absolute (relative to the root, actually) always. I still think it simplifies standardizing the bar.

Show 3 more comments

1 answer

2


Relative path is a problem in the described scenario. The 2 Urls mentioned are in fact in different paths, this "relative" would be which?

http://local.dev/example
http://local.dev/example/index

In this case the relative to the root is less problematic (called absolute, but I believe not to be the best terminology, as it does not include the domain).

An alternative, if you need to "relativize" yourself, is to force the script to always have a slash at the end (or never, by adjusting it in the CSS path).

Something like that:

<?php
    $caminho = $_SERVER['PHP_SELF'];
    if( substr( $caminho, -1 ) !== '/' && substr( $caminho, -4 ) !== '.php' ) {
        header( 'Location: '.$caminho.'/' );
        die();
    }

If you need to use query string can add to header also, concatenating after the bar with a ?.

Depending on the server and configuration, it may be the case to exchange the PHP_SELF for PATH_INFO.

Browser other questions tagged php html css

You are not signed in. Login or sign up in order to post.