0

Trying to apply some CSS to the select options in the drop down menu. The line-height or height variables are not kicking in on the <options> variables.

I'm using this:

<style>
.styled-select select {
   background: #E4E6F5;
   width: 300px;
   padding: 8px;
   font-size: 16px;
   border: 1px solid #E4E6F5;
   height: 42px;
}
select.select{
    position:relative;
    z-index:10;
    height:38px !important;
    line-height:38px;
}
span.select{
    position:absolute;
    bottom:0;
    float:left;
    left:0;
    height:38px;
    line-height:38px;
    margin-left:15px;
}
</style>

HTML code:

<div class="styled-select" style="float:right">
<select class="select">
<option>I am a....</option>
<option>Option #1 Test</option>
<option>Option #2 Test</option>
<option>Option #2 Test</option>
<option>Option #2 Test</option>
<option>Option #2 Test</option>
</select>
</div>
<span class="intro">Hello!</span><br />
<span class="register"> If this is your first visit, be sure to
        check out the <a href="faq.php{sessionurl_q}" target="_blank"><b>FAQ</b></a>. You will need to <a href="register.php{sessionurl_q}" target="_blank"><b>register</b></a>
        before you can post: click the register link to proceed. To start viewing messages,
        select the forum that you want to visit from the selection below.
</span>
3
Contributors
2
Replies
4
Views
5 Years
Discussion Span
Last Post by JameB
0

Hmm.. Dont think there is a way via CSS to apply a line height style directly to option elements.

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.