搜索栏输入不适用于其他支持的语言[关闭]

Question

I'm using the same HTML/CSS properties for a website that supports two languages. The search bar works fine in English but I cannot input anything when I change to the other language.

The website: http://barajon.com/store/

You can change the language by clicking the green flag on the top menu.

The HTML of the search bar:

<!-- Header Search Begin -->
<form class="h-search" method="post" action="search.php" name="productsearchform" onsubmit="javascript:return TXS_funcSubmitForm();" style="border-style: none; width: auto;">
  <fieldset>
    <input type="hidden" name="simple_search" value="Y" />
    <input type="hidden" name="mode" value="search" />
    <input type="hidden" name="posted_data[by_title]" value="Y" />
    <input type="hidden" name="posted_data[by_descr]" value="Y" />
    <input type="hidden" name="posted_data[by_sku]" value="Y" />
    <input type="hidden" name="posted_data[search_in_subcategories]" value="Y" />
    <input type="hidden" name="posted_data[including]" value="all" />              

    <div class="srch-area">
        <input type="text" class="srch-fld" name="{if $TXS_search_id && $active_modules.Predictive_Search ne ""}{$TXS_search_id}{else}posted_data[substring]{/if}" id="TXS_PS_search" id="TXS_PS_search" value="{$search_prefilled.substring|escape}" />
        <input class="sbmit-btn" name="" value="Go" type="submit" />
        <div class="clear"></div>
    </div>
    <input type="hidden" name="txs_area" value="C" /> 
  </fieldset>
</form>
<!-- Header Search End -->

Answer 1

The reason you cannot input text into the text box is that it is being covered by another DIV. The part of the DIV which is covering the text box is 'invisible' to the user (doesn't have a background colour or a border to signify it's there).

To force your text box to appear in front of the DIV, change the text box's z-index to a larger number, let's say 9999. Since z-index only applies to positioned elements, you must change the position of your text box to either relative, fixed, or absolute.

In your particular example, I would recommend you set the position and z-index of the div that contains the text box instead of the text box itself. In your case I would change the line:

<div class="main-menu">

to

<div class="main-menu" style="position:relative;z-index:9999;">

Modifying the class main-menu would be the better idea to achieve consistency across your entire site, either way this will fix your issue.