html - CSS not being applied to ID -
my css isn't beingness applied specific img id element on page. have spent 30 minutes trying figure thing out no avail. have 2 other elements exact same html , css beingness applied correctly. image in question: http://i.imgur.com/lrtucyo.gif other 2 images 1 far can tell.
body{ font-family: 'montserrat', sans-serif; background: url(/img/body_bg.jpg); color:#ddd; font-weight: 700; font size: 30px; } .container{ margin: 0 auto; } #blue{ height:8px; background-color: #4eb1ba; margin-bottom: 45px; } #img{ border-bottom: 2px solid #4eb1ba; } /*bottle*/ } #spray{ border: 1px solid #4eb1ba; } /*/bottle*/ /*vacuum*/ #vacuum{ border: 1px solid #4eb1ba; margin-left: 400px; margin-top: -130px; } /*vacuum*/ /*mop*/ #mop{ border: 1px solid #4eb1ba; margin-left: 630px; margin-top: -130px; } #portfolio{ margin-top:100px; } <!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"> <meta name="description" content=""> <meta name="author" content=""> <link rel="shortcut icon" href="../../assets/ico/favicon.ico"> <title></title> <!-- bootstrap core css --> <link href="bootstrap.min.css" rel="stylesheet"> <link href="style.css" rel="stylesheet"> <link href='http://fonts.googleapis.com/css?family=montserrat:400,700' rel='stylesheet' type='text/css'> <!-- debugging purposes. don't re-create line! --> <!--[if lt ie 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]--> <!-- html5 shim , respond.js ie8 back upwards of html5 elements , media queries --> <!--[if lt ie 9]> <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script> <![endif]--> </head> <body> <div class="navbar navbar-inverse navbar-fixed-top" role="navigation"> <div class="container"> <div class="navbar-header"> <a class="navbar-brand" href="index.html" </a> </div> <div class="collapse navbar-collapse"> <ul class="nav navbar-nav"> <li class="active"><a href="#">home</a></li> <li><a href="#about">services</a></li> <li><a href="#contact">get in touch</a></li> </ul> </div><!--/.nav-collapse --> </div> </div> <div class="container"> <div class="row-fluid"> <h4 class="underline"><span>recent images</span></h4> <img src="img/clean-home1.jpg" width="960" height="540" alt=""> <div id="portfolio"> <div class="row-fluid"> <div class="span4"> <img src="img/bottle.gif" id="spray" width="180" height="130"> </div> <div class="row-fluid"> <div class="span4"> <img src="img/vacuum.gif" id="vacuum" width="180" height="130"></img> </div> <div class="row-fluid"> <div class="span3"> <img src="img/mop.gif" id="mop" width="180" height="130" ></img> </div> </div> </div> </div> </div> </div><!-- /.container --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script src="../../dist/js/bootstrap.min.js"></script> </body> </html>
you have random closing brace before #spray{} rule. not sure if problem, maybe.
html css
No comments:
Post a Comment