Bootstrap is not working even though included

Question

Hi Guys I have a problem about bootstrap bootstrap.min.css jquery.min.js and bootstrap.min.js are already included in my project but I cannot use well well-sm class and when I add manually by links this time divs engage you can see in the picture. where is the problem I don't understand?

my code :

@model xx.Web.Models.MiniRepairViewModel
@{
    Layout = null;
}
<div class="pageWrapper">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
    @Html.Action("Breadcrumb", "Manage")
    <div class="TextBody">
        <div class="container">
            @Html.Action("LeftMenu", "Manage") //menu engage 
            <div class="col-threeQuarters">
     @using (Ajax.BeginForm("MiniRepairServiceAdd", "Ajax", new AjaxOptions { OnSuccess = "jsFilt", OnFailure = "OnFailure" }))
                {
                    <ul class="Form">
                        <li class="oneColumsFull">
                            @Html.DropDownListFor(x => x.GetCityModel.a, (IEnumerable<SelectListItem>)ViewBag.CitiesList, "select", new { name = "x", id = "y" })
                        </li>
                        <li id="ilce" class="twoColumsFull" style="display:none;">
                        </li>
                        <li class="oneColums"><input type="text" name="serviceName" id="serviceName" placeholder="Service"></li>

                        <li class="button"><input class=".bh-sl-reset" id="reset" type="button" value="clear" onclick="javascript: window.location.reload();"></li>
                        <li class="button"><input type="submit" value="search" name="search"></li>
                    </ul>
                }
                <div id="myDiv" class="well well-sm"> </div> //not working
            </div>
        </div>
    </div>
</div>

I think you should include the scripts inside tag and check. — Yashwardhan Pauranik, May 30 '19 at 07:11

score 2 · Answer 1 · answered May 30 '19 at 07:27

2

I am not sure if colThreeQuarters is a bootstrap class, the actual class is col

<div class="container">
   <div class="row">
      <div class="col-md-9> // 3quarters
      </div>
   </div>
</div>

answered May 30 '19 at 07:27

Aditya Thakur

2,562
2
10
21

yes..for buttons and text fields bootstrap css is applied – Pramit Sawant May 30 '19 at 07:43

Arjun · Answer 2 · 2019-05-30T07:24:46.843

0

You Need to include headtag before Bodytag and add the bootstrap cdn in that head and write you js cdn at bottom of body tag. SO the code structure will be like this

<html>
<head>
<bootstrap cdn>
</head>
<body>
your content
...
..
<js cdns>
</body>
</html>

edited May 30 '19 at 07:24

answered May 30 '19 at 07:17

Arjun

1,294
13
24

score 0 · Answer 3 · answered May 30 '19 at 07:26

This is because you are not loading your bootstrap cdn at right place. You should load all your scripts files inside your head tag as @yashwardhan said.

this mean:

Go to your code, find </head> tag and load all your scripts and css file just before this tag.

<head>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
</head>

and use the right bootstrap syntax. colThreeQuarters is not a bootstrap class

Why you should do this, is explained here:- Where should I put <script> tags in HTML markup?

sir problem is right there when i included it give me clash problem. i cannot add it say already included in your project but i can not `use well well-sm` — Joe, May 30 '19 at 07:47

Bootstrap is not working even though included

3 Answers3