CSS Style not working when using link

Question

I have jsp page with style applied by ref:

<link rel="stylesheet" type="text/css" href="/doctor/css/form_input.css" />

it doesn't influence my page this way. But when i copy the same style in html heading, it works fine... Directories structure is:

|--web  
|----doctor  
|-------------css  
|---------------------form_input.css  
|-------------view  
|---------------------view.jsp

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="/doctor/css/form_input.css">
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
    <script>
      $(function() {
        $( "#tabs" ).tabs();
      });

    </script>
  </head>
  <body>
    <form action="/changeLanguage">
      <select id="language" name="language" onchange="submit()" style="margin-left: 50px">
        <option value="en" ${language == 'en' ? 'selected' : ''}>English</option>
        <option value="ru" ${language == 'ru' ? 'selected' : ''}>Русский</option>
        <option value="es" ${language == 'es' ? 'selected' : ''}>Español</option>
      </select>
    </form>
    <ex:info-time/>
    <div id="tabs">
      <div class="container">
        <ul class="nav nav-tabs">
          <li><a href="#tabs-1"><fmt:message key="login.button.submit"></fmt:message></a></li>
          <li><a href="#tabs-2">Register </a></li>
        </ul>
        <div id="tabs-1">
          <div class="account-status">
            <form method="post" action="account">
              <fieldset>
                <label class="form-label" for="username"><fmt:message key="login.label.username" />: </label>
                <input type="text" class="form-control form-input" name="username" id="username" placeholder="Login">
              </fieldset>
              <fieldset>
                <label class="form-label" for="password"><fmt:message key="login.label.password"></fmt:message> </label>
                <input type="password" class="form-control form-input" name="password" id="password" placeholder="Password">
                <input type="submit" class="btn btn-primary form-button" value="Login">
              </fieldset>
            </form>
          </div>
        </div>
        <div id="tabs-2">
          <div class="account-status">
            <form method="post" action="account?action=register">
              <fieldset>
                <label for="username_register" class="form-label"><fmt:message key="login.label.username"></fmt:message> </label>
                <input type="text" name="username_register" id="username_register" class="form-control form-input">
              </fieldset>
              <fieldset>
                <label for="password_register" class="form-label"><fmt:message key="login.label.password"></fmt:message> </label>
                <input type="password" name="password_register" id="password_register" class="form-control form-input">
              </fieldset>
              ..etc
              <fieldset>
                <input type="submit" class="btn btn-primary form-button" value="Register">
              </fieldset>
            </form>
          </div>
        </div>
      </div>
    </div>
  </body>
</html>

UPDATE

changed href to

href="${pageContext.request.contextPath}css/form_input.css"

and by clicking f12 it shows me following error:

GET http://localhost:8086/doctor/css/form_input.css 404 NOT FOUND account:14

try this one : https://support.microsoft.com/en-us/kb/308260 — Deep Shah, Jun 23 '16 at 11:59
Please review this link. It will help you. http://stackoverflow.com/questions/14548998/adding-external-resources-css-javascript-images-etc-in-jsp — Nehemiah, Jun 23 '16 at 12:13
@Nehemiah thanks for the link, i tried both variants as was mentined there but now have a following error as i posted — Alexander Tolkachev, Jun 23 '16 at 14:07

score 0 · Answer 1 · answered Jun 23 '16 at 13:32

0

I think your path should be ../css/form_input.css if I'm not mistaken?

answered Jun 23 '16 at 13:32

david.carm

329
4
13

checked. but nothing changed – Alexander Tolkachev Jun 23 '16 at 13:53

score 0 · Answer 2 · answered Jun 23 '16 at 18:42

0

Finally i found the issue. It was just my filter that didn't let links to pass...

answered Jun 23 '16 at 18:42

Alexander Tolkachev

227
1
4
15

CSS Style not working when using link

UPDATE

2 Answers2