0

I have a search area on this website. The search button has a min width of 80 px which is coming from bootstrap. How can I remove/override the width?

Improve this question
4
  • Create a selector for that element and override that style.
    – Vucko
    Commented Sep 15, 2015 at 8:44
  • just use .search_box_class_name { min-width: width_you_want!important; }
    – Amit singh
    Commented Sep 15, 2015 at 8:46
  • you can remove btn class.
    – shyammakwana.me
    Commented Sep 15, 2015 at 8:46
  • Please include all the relevant code required to reproduce the issue in the question itself. A link is not suitable, if it dies or the problem gets fixed this question will lose all value to users with similar issues.
    – Hidden Hobbes
    Commented Sep 15, 2015 at 9:03

5 Answers 5

Reset to default
25

you can remove btn class

OR

you can override using its id selector and setting min-width to unset

min-width: unset;

in your example

input#searchsubmit {
    min-width: unset;
}
Improve this answer
1
  • I was about tho say the same thing @SublymeRick.
    – EduLopez
    Commented Oct 17, 2018 at 15:40
1

Add .btn selector in your custom CSS to override bootstrap css.

.btn {width: [n]px} /*set your desired width*/

Or

Add a new selector and set the width for that.

That's it.

Improve this answer
2
  • And what if the OP wants to keep that style, but only wants to change it for only that one element?
    – Vucko
    Commented Sep 15, 2015 at 8:48
  • Then your very first comment comes to rescue. :)
    – CodeRomeos
    Commented Sep 15, 2015 at 8:58
0

Add .btn class in your code and mark your width as important

.btn{
 width : <your value> px !important
}
Improve this answer
-1

Add a custom class to the button with no min width.

If you only want to change this button and not the others.

Example:

no-min-width {
    min-width: 0;
}
Improve this answer
1
  • no-min-width is missing the dot, in your example. This is also the wrong way to do it. See @shaymmakawana.me's answer.
    – Rick Kukiela
    Commented Aug 30, 2017 at 16:31
-1

this will work 100%

input#searchsubmit {
    min-width: inherit;
}
Improve this answer
1
  • Its already inheriting from bootstrap so you're just telling it to do the same thing its doing...
    – Rick Kukiela
    Commented Aug 30, 2017 at 16:28