View Full Version : Mozilla masking text in select boxes

07-17-2005, 05:22 PM
Hi guys,

I am currently attempting to implement a CSS version of my old site that is predominantly frames and html.

* {

in my css file unfortunately causes select box control buttons to overlay text that fills a select box in MOZILLA only.

I have experimented with padding values on the select boxes to restore the "default" but to no avail. If I try and pad from the right the select control moves with the padding. Does anyone know what these default settings are.

07-17-2005, 09:34 PM
can we get a link to yr site?

07-18-2005, 09:22 PM

demonstrates the problem.

see the select box. well mozilla is the only browser to mask the D with the drop control.

If I remove the *{padding:0} from the css the problem disappears so I know that is the culprit.


07-18-2005, 09:27 PM
looks to me like the text-align="center" on the select box is not centering in IE. maybe that is the cause.

07-19-2005, 12:19 AM
could just add this to your css

select {

07-19-2005, 07:44 PM
I could but as the select boxes on these pgaes are dynamically generated from a database by php if the database behind changes a longer text value for the card set name in the future this 'fix' will truncate the box and obscure longer text values.

I have realised with some tinkering that padding:0 in the select tag does not have this effect. Altering the padding value of * is doing something weird to the select boxes.

I am not 100% certain but I am assuming * refers to EVERY OBJECT on the page unless otherwise defined in the css.

Could it be changing the padding value on the drop down control button?

Anybody expert enough in the way Mozilla generates select boxes on the screen to know what is going on here?

07-19-2005, 08:26 PM
Yeah your right, the * {padding:0;} removes the padding on every element if it isn't specified. By default there is a default padding, you can either lose the global reset (the * padding thing) and just go from there.