Greetings from MyWebsite.html!
<DOCTYPE !html>
<html>
<head>
<title>My Website</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- CSS -->
<link rel="stylesheet" href="MyWebsite.css" media="screen" type="text/css">
<!-- Bootstrap -->
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"> </script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"> </script>
</head>
<body>
<div class="top">
<div class="panel-footer row"><!-- panel-footer -->
<div class="col-xs-6 text-left">
<button id="home" type="button" class="btn btn-primary"><span class="glyphicon glyphicon-home"></span><a href="#" style="color:white"> Home</a></button>
<a href="#"> <img href="#" style="height:35px" src="https://play.google.com/intl/en_us/badges/images/generic/en-play-badge.png"> </a>
<a href="#"> <img href="#" style="height:35px" src="http://www.mosa.nl/files/8613/8668/4836/available-in-app-store-badge.png"> </a>
</div>
<div class="col-xs-6 text-right">
<button id="ourApps" type="button" class="btn btn-primary"><span class="glyphicon glyphicon-phone"></span><a href="#" style="color:white"> Our Apps</a></button>
<button id="contactUs" type="button" class="btn btn-primary"><span class="glyphicon glyphicon-user"></span><a href="#" style="color:white"> Contact Us</a></button>
</div>
</div><!-- end panel-footer -->
</div>
</body>
</html>
It's been quite a challenge with my CSS files as I've tried several times to clear them due to their unresponsiveness. Upon opening the website in Chrome browser, the CSS fails to take effect. Even after setting "text-decoration: none;" for all <a> tags, there's still an underline when hovering over the text. Similarly, color changes do not reflect correctly either, remaining black regardless of adjustments made. What could be causing this lack of responsiveness?