# CSS problem with discourse search window after latest update
**URL:** https://meta.discourse.org/t/css-problem-with-discourse-search-window-after-latest-update/101390
**Category:** Support
**Created:** [November 6, 2018, 8:48am UTC](https://meta.discourse.org/t/css-problem-with-discourse-search-window-after-latest-update/101390 "2018-11-06T08:48:44Z")
**Posts on this page:** 6
**Page:** 1
### Author:  [@Pravi](https://meta.discourse.org/u/Pravi)
#### Post date: [November 6, 2018, 8:48am UTC](https://meta.discourse.org/t/css-problem-with-discourse-search-window-after-latest-update/101390/1 "2018-11-06T08:48:44Z")
Not sure its a bug or problem related to my custom CSS. Noticed since the last update.
---
### Author:  [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [November 6, 2018, 8:50am UTC](https://meta.discourse.org/t/css-problem-with-discourse-search-window-after-latest-update/101390/2 "2018-11-06T08:50:37Z")
This is specific to your site and CSS, because I can’t repro it here on meta.
Unless it repros here, it is unlikely to be a Discourse problem.
---
### Author:  [@Pravi](https://meta.discourse.org/u/Pravi)
#### Post date: [November 6, 2018, 9:04am UTC](https://meta.discourse.org/t/css-problem-with-discourse-search-window-after-latest-update/101390/3 "2018-11-06T09:04:39Z")
Well, In that case, I need some help from some CSS Experts. I think something bad is in current CSS style.
```
@import url('https://fonts.googleapis.com/css?family=Redressed');
@import url('https://fonts.googleapis.com/css?family=Philosopher');
header #site-text-logo {
font-size: 26px;
//font-style: italic;
font-family: 'Redressed', cursive;
color: #2471a3; //#5c998b;
position: relative;
top: -3px;
left: 25px;
filter: drop-shadow(1px 1px 1px #fff) drop-shadow(-1px 1px 1px #fff) drop-shadow(1px -1px 1px #fff);
}
.d-header {
padding: 0;
height: 0;
background-color: #323433; // Header Background color
width: 100%;
padding-top: 0;
height: 48px;
box-shadow: none;
}
.d-header .wrap {
background-color: #fff;
max-width: 1144px;
box-shadow: 0 2px 4px -1px rgba(0,0,0,0.25);
}
.d-header .panel {
top: 3px;
}
#main-outlet {
padding-top: 70px;
}
/* lt. gray container around main content area */
#main {
width: 1110px;
background-color: #ffffff;
margin: 0 auto;
position: static;
padding: 0 25px 25px;
}
.title-wrapper {
padding-bottom: 3px;
}
.extra-info-wrapper .topic-link {
font-family: 'Philosopher', sans-serif;
}
.extra-info-wrapper .badge-wrapper.bullet span.badge-category {
font-family: 'Philosopher', sans-serif;
font-size: 13px;
}
#topic-title h1 a {
font-family: 'Philosopher', sans-serif;
}
.badge-wrapper.bullet span.badge-category {
font-family: 'Philosopher', sans-serif;
}
.d-header-icons .badge-notification {
margin: 5px 0;
//background: #00AEEF;
}
.d-header .contents {
margin: 2px 0;
}
/* dark gray background in body */
body {
background-color: #323433;
//height: 100%;
}
html {
background-color: #323433;
}
/* set fixed container sizes */
div.full-width {
width: 1110px;
}
div.container {
width: 1110px;
}
.admin-content {
width: 1110px;
}
#user-menu {
width: 1110px;
}
.modal-outer-container {
width: 1110px;
}
/* keep reply control left justified */
#reply-control {
left: 0;
z-index: 999;
}
/* login button color tweak for consistency */
.btn-primary {
background-image: linear-gradient(to bottom, #00AEEF, #009EDA);
}
/* top nav & admin button colors */
.nav-pills li>a:hover { /* inactive button hover (lt. blue) */
color: #009EDA;
background-color: #CADCEF;
border-color: #BDBDBD;
}
.nav-pills li.active>a, .nav-pills li>a.active { /* active button static (dk. blue) */
border-color: #16617d;
background-color:#00AEEF;
background-image: linear-gradient(to bottom, #00AEEF, #009EDA);
box-shadow:inset 0 1px 0 rgba(255,255,255,0.33);
}
.nav-pills li.active>a:hover, .nav-pills li>a.active:hover { /* active button hover (dk. blue) */
border-color: #16617d;
background-color:#00AEEF;
background-image:linear-gradient(to bottom, #00AEEF, #00B0F0);
box-shadow:inset 0 1px 0 rgba(255,255,255,0.33),inset 0 -1px 2px rgba(0,0,0,0.2);
color: white;
}
/* side nav button colors (profile pages, etc) */
.nav-stacked li.active a, .nav-stacked li.active a:hover { /* active button static */
background-color: #CADCEF;
color: #333;
}
.nav-stacked .active .icon-chevron-right, .nav-stacked .active:hover .icon-chevron-right { /* arrow bg */
color: #333;
background-color: transparent;
text-shadow: none;
}
.nav-stacked li:hover .icon-chevron-right { /* button arrow hover */
color: #333;
}
/* topic list table styling */
#topic-list tbody tr:nth-child(even) {
background-color:#F0F0F0;
}
#main #topic-list th {
background-color:#E6E6E6;
}
```
---
### Author:  [@Johani](https://meta.discourse.org/u/Johani)
#### Post date: [November 6, 2018, 9:09am UTC](https://meta.discourse.org/t/css-problem-with-discourse-search-window-after-latest-update/101390/4 "2018-11-06T09:09:58Z")
The rule starting at line #96 in your desktop CSS is too broad.
```plaintext
div.container {
width: 1110px;
}
```
You’re forcing all divs with the `container` class to be 1110px wide. The inputs you’re having problems with inherit that width.
The real fix is that your selectors should be more specific to the elements you want to target.
However you can try something like this if you’re looking for a quick fix:
```plaintext
div.container {
width: 1110px;
max-width: 100%;
}
```
---
### Author:  [@Pravi](https://meta.discourse.org/u/Pravi)
#### Post date: [November 8, 2018, 4:47pm UTC](https://meta.discourse.org/t/css-problem-with-discourse-search-window-after-latest-update/101390/5 "2018-11-08T16:47:07Z")
Thanks you so much @Johani .You are a CSS God.
---
### Author:  [@system](https://meta.discourse.org/u/system)
#### Post date: [December 8, 2018, 4:47pm UTC](https://meta.discourse.org/t/css-problem-with-discourse-search-window-after-latest-update/101390/6 "2018-12-08T16:47:16Z")
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.