Question

我目前有许多html下拉列表，除了具有大文本选择的列表外，还可以正常工作。目前，当选择此特定下拉列表时，列表会将网页左侧对齐。理想情况下，我希望下拉列表显示在页面的中心位置。是否有一个特定的CSS样式可以允许这个？干杯

下图显示了此示例。列表中的条目非常大，因此列表的范围很广。

http://i.stack.imgur.com/3svxw.png

<?php

    $query = "SELECT `Contracted Support Hours` FROM poc_sla GROUP BY `Contracted Support Hours`"; 
    $result = mysql_query($query);

?>

    <select  name="contracted_support_hours" id="contracted_support_hours" style="width:400px; text-align:center;" class="new_input_fields" required>

        <option value="">--Select--</option>

<?php

    while ($line = mysql_fetch_array($result, MYSQL_ASSOC)) {

?> 

        <option value="<?php echo $line['Contracted Support Hours'];?>"> <?php echo $line['Contracted Support Hours'];?> </option>

<?php
}
?>


    </select>

Answer 1

您可以尝试使用css选项选择器然后应用样式。

select, option { max-width: 100px; }

或者

select, option { width: [//Your custom]; }

Answer 2

我认为您需要将PHP中的字符串剪切为字符数限制。

在你的时间：

 <option value="<?php echo $line['Contracted Support Hours'];?>"> 
         <?php echo ((strlen($line['Contracted Support Hours']) > 150) ?
               substr($line['Contracted Support Hours'], 0, 150)."..." : 
               $line['Contracted Support Hours']);?> 
 </option>

它是如何运作的？

检查字符串是否超过150个字符，如果为true，则将字符串剪切150个字符并添加省略号。

带有大文本选择的HTML下拉对齐页面

2 个答案: