When adding bootstrap.min.css design of the template changes, can something be done?

Normal view

When adding these files [! [Normal site view

When adding these files

enter image description here

 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"> <select id="lunchBegins" class="selectpicker" data-live-search="true" data-live-search-style="begins" title="Please select a lunch ..."> <option>Hot Dog, Fries and a Soda</option> <option>Burger, Shake and a Smile</option> <option>Sugar, Spice and all things nice</option> <option>Baby Back Ribs</option> <option>A really really long option made to illustrate an issue with the live search in an inline form</option> </select>
  • HTML code attach - Alex78191
  • Attached, downloaded another bootstrap, select and option curves - Valera Khomchenko
  • as a fragment attach - Alex78191
  • does not work, a lot of local files - Valera Khomchenko
  • one
    Make a minimal example of ru.stackoverflow.com/help/mcve as it was before and after - Alex78191

2 answers 2

Good afternoon, this is due to the conflict of the names of your classes and the bootstrap classes. Using the developer tools (f12 in the browser) on the right, you can see which css properties are being overwritten and what goes wrong. It's hard to say without a demo.

    Rename the selectpicker class. This is the bootstrap select class, so if you don’t want the library style to be applied, then the class name should be unique.

    • Expand your answer. Explain why this is exactly what needs to be done, and so on. - MihailPw