About the search box css settings

4 posts from 3 voices

• Started 7 months ago by cxxc
• Latest reply from Devin
• This topic is not a support question

Tags:

• search box

1. 

   cxxc
   Member

   I’m using the following code to create drop-down serach box.
   in searchform.php file:
   <form action="<?php echo home_url( '/' ); ?>" id="searchform" method="get">
   <div>
   <input type="text" id="s" name="s" value="<?php _e('search site', 'avia_framework')?>"/>
   <?php wp_dropdown_categories( 'show_option_all=All' ); ?>
   <input type="submit" value="Search" id="searchsubmit" class="button"/>
   </div>
   </form><!-- end searchform-->

   http://21pre.com
   The following problem appears:
   1,Search box to display properly in Firefox/chrom, but in IE dislocation
   2,'All' can be displayed to other languages?

   I tried using custom.css, but I obviously am not using the right code to apply them.

   thanks everyone for the continuing help on here

   Posted 7 months ago #
2. 

   Dude
   Dude

   Hey!

   Unfortunately there's not enough space to display the dropdown next to the search input field - following code will push the dropdown into the next line though:

   #searchform {
       width: 192px;
   }

   Best regards,
   Peter

   Posted 7 months ago #
3. 

   cxxc
   Member

   In chrome and firefox are normal, but there is a problem in IE

   The following are several display in the browser:

   IE6：
   

   IE8:
   

   firefox & chrom:
   

   Posted 7 months ago #
4. 

   Devin
   Moderator

   Hi cxxc,

   You can add browser specific css to change the layout to exactly how you want it in each browser. So something like this:
   .msie6 #searchform {width: 192px;}

   The same thing can be done with msie7 and msie8 as the starting class and then add the css needed to customize it to fit your needs.

   Regards,

   Devin

   Posted 7 months ago #

RSS feed for this topic

Reply

You must log in to post.