i'm newbie web design , got bootstrap. started using codepen. after working on project in codepen went copy , paste code there sublime , whatever reason changed of stuff on page i.e. css footer , of text.
now whatever reason footer huge , of text gold. in css did specify gold text. when move css link in html file below script tags bootstrap page changes. regardless of put css link or scripts still don't page displaying correct way.
why location of css link , bootstrap script matter? both in head.
i installed emmet , started toying github , pushed files github right before issue. not sure if relevant.
<meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="styles.css"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/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.4/js/bootstrap.min.js"></script> <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css"> <link rel="stylesheet" type="text/css" href="realsite/styles.css"> <link href='http://fonts.googleapis.com/css?family=marcellus+sc' rel='stylesheet' type='text/css'>
the css specification dictates following rules when applying css:
- !important
- rule origin
- specificity
- order
it sounds 4th getting issue. means if have following:
.cssrule { color: white; } .cssrule { color: gold } then color gold, because last rule specified. generally, specificity rule used around in experience, example:
#ida .cssrule { color: white; } .cssrule { color: gold } in scenario, div this:
<div class="cssrule" id="ida"> would apply color white.
Comments
Post a Comment