Home/ Questions/Q 9215009
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-18T02:06:19+00:00

I created a website using bootstrap, mainly for learning purposes. I am using the

  • 0

I created a website using bootstrap, mainly for learning purposes. I am using the <div class="navbar navbar-inverse">. I put my website onto a server and asked some of my buddies to check it out. Everyone called and said it looked great but then one said everything was jumbled around when he used Internet Explorer (don’t know exactly what version but definitely an older one) I tried it out on internet explorer and the nav bar was jumbled.

The List items were not inline. The bar was twice as big as it should be, and the text was underlined and purple…

I have been trying to fix this issue for the past couple of days but I just can’t. How should I go about making my website act similar enough in every browser so it doesn’t look broken?

It is really frustrating, and I am ready to accept any sources for 1. learning about this and 2. fixing this issue.

Thanks!

Code for HTML:

<html>
<head>
    <!--[if lt IE 9]-->
        <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <!--[endif]-->
    <title> College GPA </title>
    <link rel = 'stylesheet' type = 'text/css' href = "assets/css/style.css">
    <link rel = 'stylesheet' type = 'text/css' href = 'assets/css/bootstrap.min.css'>

    <script src="http://code.jquery.com/jquery-1.8.3.js"></script>
    <script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>

    <script src = "assets/js/dropdown.js">
    </script>
    <script> 
        $(".dropdown-toggle").dropdown();
    </script>

</head>


<body>
    <div class="navbar navbar-inverse">
        <div class="navbar-inner">
            <div class="container">

              <!-- .btn-navbar is used as the toggle for collapsed navbar content -->
              <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
              </a>

              <!-- Be sure to leave the brand out there if you want it shown -->
              <a class="brand" href="#" style = "font-size: 23px;">LOGO</a>

              <!-- Everything you want hidden at 940px or less, place within here -->
             <div class="nav-collapse collapse">
                <!-- .nav, .navbar-search, .navbar-form, etc -->
                <ul class = "nav">
                    <li class = 'active'> <a href = "#"> Home </a></li>
                    <li class = 'dropdown'> 
                        <a href = "#" class = 'dropdown-toggle' id = "dLabel" data-toggle = "dropdown">Drop Down <b class = 'caret'> </b></a>
                        <ul class = 'dropdown-menu' role = 'menu' aria-labelledby="dLabel">
                            <li> <a href = "#">Drop Down 1 </a> </li>
                            <li> <a href = "#">Drop Down 2 </a> </li>
                            <li> <a href = "#"> Drop Down 3</a> </li>
                        </ul>
                    </li>
                    <li class = 'dropdown'> 
                        <a href = "#" class = 'dropdown-toggle' id = "dLabel" data-toggle = "dropdown">Drop Down  <b class = 'caret'> </b></a>
                        <ul class = 'dropdown-menu' role = 'menu' aria-labelledby="dLabel">
                            <li> <a href = "#"> Drop Down 1   </a> </li>
                            <li> <a href = "#"> Drop down 2 </a> </li>

                        </ul>
                    </li>

                </ul>
         </div>

    </div>
  </div>
    </div>


    <div class = 'wrapper'>



    </div>


</body>

</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    It doesn’t help much that you don’t know what version he was using… perhaps you should ask him? If it’s old enough it’s possible that bootstrap just doesn’t support it (IE < 7).

    If that’s the case, just ignore it. Few companies still support older versions of IE, and those that do tend to have a specific reason.

    If you’re looking for a good way to deal with old browsers, perhaps you could display an option to upgrade to a newer browser, and a warning that it may not display properly in their browser.

    http://gs.statcounter.com/ is a good source to get usage statistics of older browsers. From there you can decide if you really want to support them.

    Finally, you can always look at analytics for your site (if you happen to have an existing one with traffic) to see if maintaining support for an older browser is worth your time.

    • 0