Hi the problem is defining the font only to the text displayed in the dropdown. In detail when we click on the drop down it shows all the available options. these options should have normal or default font size but when i select an option that gets displayed in the dropdown. so this displayed text should have a different font size. Is this possible. if so what is the css for this?

Recommended Answers

All 6 Replies

any help will be deeply appreciated. Thank u so much.

well, as far as I know, you can easily specify font for some element using CSS
you only have to narrow down the selection of the element....
like:

ul, li {
    font-size:14px; 
    font-family:Arial, Helvetica, sans-serif;
    line-height:21px;
    text-align:left;
    }

or if it belongs to some specific DIV.. name it.. and there you have it...

As far as I know, you cannot style the options elements listed within the <select> element except for the background-color and color properties. All other styling is applied to the <select> element.

ya i think what "JorgeM" said is right. I just want to have a different font for the visible text in the <select> box and all other options that gets displayed in the dropdown should have a normal font but i think this is not possible.

Anyways if anybody have a solution please let me know.

<select>

    <option value="Arial">First</option>
    <option value="Verdana">Second</option>


    </select>




    $(function() {
    $('select > option').hover(function() {
        $(this).parent().css({fontFamily:$(this).val()})    
})            
})

@azapovjednik- Can you implement your example in a test page, or jsfiddle to see it action?

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.