This code: <base href="[var.base_url]/"> <link href="[var.base_url]/themes/default/css/main.css" rel="stylesheet" type="text/css" media="all" /> Code (markup): And this code: <base href="[var.base_url]/"> <link href="../themes/default/css/main.css" rel="stylesheet" type="text/css" media="all" /> Code (markup): show the page differently. Why? Aren't they pointing to the same css file?
No, they aren't because BASE applies to the second one, so ../ points at a directory one UP from it. <base href="[var.base_url]/"> <link href="themes/default/css/main.css" rel="stylesheet" type="text/css" media="all" /> Code (markup): Is the same as your first one. If your var.base_url was /test/hamsters, your first example (and the one above) would resolve to /test/hamsters/themes/default/css/main.css, your second one thanks to the up-tree link (../) resolves to /test/themes/default/css/main.css -- that's what ../ DOES. (and usually if you "have" to use ../ there is something wrong with your directory structure!) That said, sending media = "all" is bad practice since dimes to dollars that's screen target CSS that would look bad printed or screw up some handheld -- but then so are uselessly vague filenames like "main.css" so...