html - Bootstrap modal takes space even when closed or if changed all link colors change -
if use code this, links on shop have blue color. right links black , want them stay this.
if delete header code, links black again, modal takes space on page (makes huge blank white space) if open , page goes @ bottom of "open modal" close, takes space.
i pretty new coding, appreciate help.
thank you
<head> <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css"> <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css"> </head> <body> <!-- button trigger modal --> <a data-toggle="modal" href="#mymodal" class="btn btn-primary btn-lg">launch demo modal</a> <!-- modal --> <div class="modal fade" id="mymodal" tabindex="-1" role="dialog" aria-labelledby="mymodallabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h4 class="modal-title">modal title</h4> </div> <div class="modal-body"> <img class="img-responsive" src="http://vmatechs.com/wp-content/uploads/2013/07/android.jpg" alt="image" /> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">close</button> <button type="button" class="btn btn-primary">save changes</button> </div> </div><!-- /.modal-content --> </div><!-- /.modal-dialog --> </div><!-- /.modal --> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> <body>
i can't tell exact code have write issue that: bootstrap.min.css file re-styling link colors. here code creates problem:
a { color: #428bca; text-decoration: none; }
so have override style adding new 1 custom css file , sure css file imported page after bootstrap.min.css. example let's assume have custom css file called style.css. must have code block make links black
a { color: #000; text-decoration: none; }
and must imported in html file that:
<head> <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css"> <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css"> <link rel="stylesheet" href="style.css"> </head>
i guess solve problem.
Comments
Post a Comment