Cannot change input width beyond 98px

[philipfarmerParticipant]

Hi there,

Im in the process of customising the search field input and id like the width to be flexible – 100%, but it appears to always append some inline width of 98px, which i can’t seem to remove. can you help?

you can find the site here:http://www.humancities.eu/hc2015
then click the search icon to open the search popup

look forward to your reply

Philip

[Ernest MarcinkoKeymaster]

Hi!

Of course. In some cases if the search bar is placed to appear on a javascript event (like in your case) the width is not triggered to calculate correctly.

The best and simplest fix is to force a min-width CSS attribute for the input fields:

.proinput input {
    min-width: 350px;
}

You can add this code to the Custom CSS field, which you can find on the Theme Options->Custom CSS panel on the search options page.

Best,
Ernest Marcinko
If you like my products, don't forget to rate them on codecanyon :)

[philipfarmerParticipant]

This is great! works perfect.

I also see that this is the best place to add css as its reset my customised css from the css file. Is this correct?

[Ernest MarcinkoKeymaster]

Yes, but it’s actually outputted into the header as inline CSS, since it’s only a few lines. It’s the best place to put custom CSS, because the changes are visible immediately and it’s stored in the database so the future updates will not delete it.

Best,
Ernest Marcinko
If you like my products, don't forget to rate them on codecanyon :)

[Author]

Posts