What causes radio buttons to look like this?

[StadriWebmaster]

I am trying to make some radio buttons and this is what they end up looking like by default- all elongated. They don't even have a style applied to them. I figure it must be something in my stylesheet, but I don't know what. Can someone who is good with css take a look? Thanks!



Link to style sheet:
http://qualitywovenlabels.com/style.css

[resdog]

Can you supply the html markup for these, as you may be assigning the buttons to a class without knowing it, but we can't tell unless we see what code you are using.

[bastones]

Probably this piece of code:

input{
   	border-right:1px solid #cecbb8;
   	border-top:1px solid #595a4e;
   	border-left:1px solid #595a4e;
   	border-bottom:1px solid #cecbb8; 
	background:#f2f2e6;
	width:175px;
	font-size:1em;
	padding-left:5px;
}

Specifically:

width:175px;

As the radio button code is:

<input type="radio">

Check whether the radio buttons have a class attribute attached, like this:

<input type="radio" class="input">

If they do, it'll be due to this in your CSS code:

.input{
	width:118px;
	font-size:1em;
	padding-left:5px;
	margin-left:25px;
	vertical-align:middle;
	background:#FFFFFF
}

And likewise if it is the .input1 class in your CSS code.

[VIPStephan]

You can as well write input[type=text] {…} if you only want to style inputs with a “type” attribute that has a value of “text” (i. e. only text inputs) or alternatively you can reset the width for radio buttons with input[type=radio] {width: auto;}. In IE 6 these style declarations don’t work so you may have to resort to classes as stated earlier, if you need to supply for IE 6, too.