CODEWITHSUNDEEP
phphtmlcssweb
Lachlan Turnley
Lachlan Turnley

Reputation: 11

HTML not linking to css file

Hey I'm working on a really basic page for a cafe I'm starting up. I've got code working to randomly select a background image for the page from a pool of photos I've done but when I try to reference a css file in the same directory, the styles are not reflected in the page at all.

index.php

<?php
  $bg = array('bg1.jpg', 'bg2.jpg', 'bg3.jpg', 'bg4.jpg', 'bg5.jpg', 'bg6.jpg', 'bg7.jpg' ); // array of filenames

  $i = rand(0, count($bg)-1); // generate random number size of the array
  $selectedBg = "$bg[$i]"; // set variable equal to which random filename was chosen
?>
<!DOCTYPE html>
<html lang="en">
<html>
    <head>
        <title>Recharge Cafe</title>
                <link type="text/css" rel="stylesheet" href="stylesheet.css"/>
        <style type="text/css">
            body {
            background: url(images/<?php echo $selectedBg; ?>) no-repeat center center fixed;
            -webkit-background-size: cover;
            -moz-background-size: cover;
            -o-background-size: cover;
            background-size: cover;
            }
        </style>
        <script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-79082509-1', 'auto');
  ga('send', 'pageview');
</script>
    </head>
    <body>
        <p>Recharge Cafe</p>
    </body>
</html>

stylesheet.css

html {
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

p {
    color: FFFFFF;
}

EDIT: If anyone wants to look it is at http://recharge.cafe

Upvotes: 1

Views: 47

Answers (1)

Edmond Wang
Edmond Wang

Reputation: 1697

Actually according to the site you provided, the CSS file has been loaded. The reason why you do not see the "Rechage Cafe" text is that you specify an invalid value to the font color. 

p {
  color: FFFFFF
}

It not works. RGB color should prefixed by one '#' symbol.
It should be:

p {
  color: #FFFFFF
}

Upvotes: 2

Related Questions