• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1530
  • Last Modified:

Firefox Drop Down List

Hello

In firefox the height of the dropdown box is too big.  It has space above before the dropdown arrow starts.  So it sort of looks like a textbox sitting on top of a select box.

ANy ideas of how to fix this?  It makes it look messy.

Thanks

JO


0
Joana
Asked:
Joana
  • 6
  • 4
1 Solution
 
Codeit1978Commented:
With CSS you can change the size and width of a drop down box.
0
 
Codeit1978Commented:
I will see if I can find the code for you.
0
 
JoanaAuthor Commented:
I have tried that

width: 12px
height: 12px

dosn't do anything?
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
Codeit1978Commented:
Can you post your code you are using?
0
 
JoanaAuthor Commented:
*****  CODE ****
<tr>
      <td class="quicklink"><select id="Apples" class="rightnav">
            <option  value="" selected="selected">&nbsp;</option>
            <option  value="One" selected="selected">One</option>
            <option  value="Two" selected="selected">Two</option>
      </select></td>
</tr>

***** CSS  ******

select.rightnav{
      width: 130px;
      font-size: xx-small;
      display: box;
      color: #666666;
      font-family: Verdana, Helvetica, Arial, Sans-Serif;
}      
0
 
Codeit1978Commented:
Try "font-size: 8pt" instead of xx-small
0
 
JoanaAuthor Commented:
No sorry it didn't work

0
 
JoanaAuthor Commented:
Ooo got it
The it's parent style had top padding, the other browsers didn't inherit it becasue it was a select, firefox must work different :-)
0
 
Codeit1978Commented:
<HTML>
<HEAD>
<style type="text/css">
<!--
select.rightnav { font-family: verdana; font-size: 5pt; }
-->
</style>
</HEAD>
<body><select id="Apples" class="rightnav">
          <option  value="" selected="selected">&nbsp;</option>
          <option  value="One" selected="selected">One</option>
          <option  value="Two" selected="selected">Two</option>
     </select>
</body>
</HTML>

Here is my code and I tested it in both IE and firefox and it seems to work.
Try doing a control shift-f5 to grab a new copy from the server, or clear your temp internet files and relaunch your browser.
0
 
Codeit1978Commented:
Hey glad to see it's working!
0

Featured Post

New feature and membership benefit!

New feature! Upgrade and increase expert visibility of your issues with Priority Questions.

  • 6
  • 4
Tackle projects and never again get stuck behind a technical roadblock.
Join Now