CODEWITHSUNDEEP
htmlcssmobile
danjswade
danjswade

Reputation: 567

CSS Sheet not being picked up on Mobile devices

Everything works perfectly on my laptop and renders just fine on the browser when adjusting size etc. I've uploaded all files and tried to test on my mobile and tablet, but the my css sheet doesn't seem to be being picked up. My headers are:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
    <!-- Optional theme -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">
    <!-- Latest compiled and minified JavaScript -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>

    <link rel="stylesheet" href="http://localhost/mrfcredesign/public/css/mrfc.css"/>

 </head>

Can anyone help my sanity?

Upvotes: 0

Views: 109

Answers (1)

Samuel Littley
Samuel Littley

Reputation: 734

localhost on your phone is not the same localhost as on your laptop - you need to change the href on your stylesheet to be either just a relative link (e.g. /css/mrfc.css or similar), or an absolute link to an actual server address.

Upvotes: 2

Related Questions