html - JSP doesn't pick up bootstrap css (IDEA + Tomcat) -
here thing: i'm creating html file w/ bootstrap css in intellijidea (code below). open in browser , work correctly.
copy code .jsp file, start tomcat server , css's doesn't work.
<html> <head> <title>money transfer</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- bootstrap --> <link href="bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" media="screen"> <link href="bootstrap/dist/css/bootstrap.css" rel="stylesheet" media="screen"> </head> <body> <form action="submit" method="get"> <form class="form-horizontal" role="form"> <div class="row"> <div class="col-md-5 col-md-offset-4"> <h2 class="form-signing-heading">money transfer form</h2></div> </div> <div class="form-group"> <div class="row"> <div class="col-md-1 col-md-offset-3"><label>sender</label></div> <div class="col-md-3"><select name="sender" class="form-control"> <option value="john doe">john doe</option> <option value="mr.smith">mr.smith</option> <option value="scratchcard">scratchcard</option> </select></div> </div> </div> <div class="form-group"> <div class="row"> <div class="col-md-1 col-md-offset-3"><label>receiver</label></div> <div class="col-md-3"><select name="receiver" class="form-control"> <option value="jane doe">jane doe</option> <option value="mrs.smith">mrs.smith</option> <option value="system">system</option> </select></div> </div> </div> <div class="form-group"> <div class="row"> <div class="col-md-1 col-md-offset-3"><label>amount</label></div> <div class="col-md-3"> <div class="input-group"> <input type="amount" class="form-control" placeholder="amount" name="amount"> <span class="input-group-addon">$</span> </div> </div> </div> </div> <div class="form-group"> <div class="col-md-offset-5"> <button type="send" class="btn btn-success">send</button> <button type="cancel" class="btn btn-link">cancel</button> </div> </div> </form> </form> <script src="//code.jquery.com/jquery.js"></script> <script src="bootstrap/dist/js/bootstrap.min.js"></script> </body> </html>
i think there's problem relative paths. relative path jsp , relative path html files different. upon viewing jsp page, view source code in browser , try open these css files. error message.
i not know project files/folders structure, recommend use servlet context path in jsp file calculate correct path css files.
use request.getcontextpath() context path in jsp file , compose full path css/javascript files using expression.
if bootstrap folder located @ root of web-application folder, use construction:
<link href="<%=request.getcontextpath()%>/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" media="screen">
Comments
Post a Comment