3

我有一个根据其内容（PHP 的动态内容）扩展的选择框。提交按钮的位置在 IE7 中保持固定，但如图所示。

IE7位置问题

我尝试添加缩放：1，并应用位置：相对于两个选择框和提交按钮无济于事。

在 Firebug 中，如果我取消选择并重新选择任何 css 选项，它会正确重新定位。有没有人有任何修复的想法？

HTML -

<div class="filter">
            <form name="input" action="#" method="post" title="Submit">
                <span class="purple">Filter photography by:</span>


                <select id="search_type" name="brand_filter">
                    <option value="0">No filter</option>
                    <option value="1" <?= ($this->session->userdata('selected_brand_filter') == 1) ? 'selected="selected"' : ''?>>Brand</option>
                    <option value="2" <?= ($this->session->userdata('selected_brand_filter') == 2) ? 'selected="selected"' : ''?>>Hotel/Location</option>
                    <option value="3" <?= ($this->session->userdata('selected_brand_filter') == 3) ? 'selected="selected"' : ''?>>Region</option>
                    <option value="4" <?= ($this->session->userdata('selected_brand_filter') == 4) ? 'selected="selected"' : ''?>>Event</option>
                </select>
                <select id="search_category" name="category_filter">
                    <option value="0">Nothing selected</option>
                    <? if(!empty($category_filter)): ?>
                            <? foreach($category_filter as $catg): ?>
                                    <option value="<?=$catg->id?>" <?= ($this->session->userdata('selected_category_filter') == $catg->id) ? 'selected="selected"' : ''?>><?= $catg->name ?></option>
                            <? endforeach ?>
                    <? endif ?>
                </select>
                <input type="submit" value="" id="filter-submit"/>
            </form>
        </div>

CSS -

#filter-submit{
width:20px;
height:20px;
background: url('../images/filter_submit.jpg') no-repeat;
border:none;
cursor:pointer;
vertical-align:middle;

}

4

2 回答 2

0

你还支持IE7？我也感受到你的痛苦。

我认为最好的办法是将它放在一个表格或一系列 div 标签中。

我在 IE 中发现的另一件事是调整父容器中的内容，例如为周围的 div 设置宽度可能会起作用。有时，提交按钮之类的指定宽度需要所有父对象中的指定宽度。（奇怪我知道）

抱歉，它太模糊了，我通过反复试验解决了所有这些问题，并且只是对 IE 发誓，因为它不像其他浏览器那样符合 Web 标准。

将您的组件放入单独的 div 或表格列中肯定会解决它。

于 2012-08-17T10:14:30.310 回答
0

好的，所以我通过设置一个短计时器并动态更改 CSS 属性找到了 JS/JQuery 解决方法。它不漂亮但似乎有效，除非其他人有更好的建议

$(document).ready(function() {        
    $('#search_type').change(function(){
        filtertimer = setTimeout('timeout_trigger()', 100);
    });
});

function timeout_trigger(){
    $('#filter-submit').css({'display':'block'});
    $('#filter-submit').css({'display':'inline'});
    clearTimeout(filtertimer);
}
于 2012-08-17T11:07:11.067 回答