CODEWITHSUNDEEP
htmltwitter-bootstrap
Umidjon Urunov
Umidjon Urunov

Reputation: 671

Twitter Bootstrap not working

Hi~ I am trying to implement Twitter Bootstrap but it is not working! I downloaded latest version of Twitter Bootstrap ( Bootstrap v3.0.3 ), JQuery ( jquery-1.10.2.js ). My folder

bootstrap/
|---index.html
├── css/
│   ├── bootstrap.css
│   ├── bootstrap.min.css
│   ├── bootstrap-theme.css
│   └── bootstrap-theme.min.css
├── js/
│   ├── bootstrap.js
│   ├── jquery-1.10.2.js
│   └── bootstrap.min.js
└── fonts/
    ├── glyphicons-halflings-regular.eot
    ├── glyphicons-halflings-regular.svg
    ├── glyphicons-halflings-regular.ttf
    └── glyphicons-halflings-regular.woff

This is index.html

<!DOCTYPE html>
<html>
  <head>
    <title>Bootstrap</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- Bootstrap -->
    <link href="css/bootstrap.css" rel="stylesheet">

  </head>
  <body>
    <h1>Hello, world!</h1>

    <input type='text' name='text'>

    <script src="js/jquery-1.10.2.js"></script>
    <script src="js/bootstrap.js"></script>

  </body>
</html>

enter image description here

Upvotes: 0

Views: 2288

Answers (2)

Sachin
Sachin

Reputation: 40970

Bootstrap doesn't apply the class on controls by default. You need to assign the class to input control to see the effect.

Use class="form-control" with input controls like this

<input type='text' name='text' class="form-control">

Upvotes: 2

Frazzled Penguin
Frazzled Penguin

Reputation: 61

Try moving the two script tags for jquery and boostrap into the head section. Or if you don't want it in the head, try putting it before your content.

Upvotes: 0

Related Questions