Im trying to put some stuff into a 2 column panelGrid and no matter what I do there is always unnecessary padding around a selectRadio. Any idea how to make it go away?

enter image description here

The css I have applied is:

  .col1 {width:200px; text-align:left;border: 2px solid black;}
  .col2 {width:150px; text-align:left; padding: 0; margin: 0; line-height: 0;border: 2px solid black;} 
  .radio{position: relative; height:0; top: 0; padding: 0; left: 0; maargin: 0; line-height: 0; background-color: red;}

But even with everything 0'd off it still moves it what looks like 5-10px off. However If I put say a commandbutton in there like the lower row it does not put that space there so it isn't like it is an issue with that particular cell, its just an issue with the radios. Any ideas?

I just put the radio in red so you can see where the outline of it is, it isnt even touching the left border.

  • a related issue you have is alignment of labels - this may help: cropredysfdc.com/2014/02/20/…
    – cropredy
    Jul 23, 2014 at 18:58
  • Thanks, yah that will be gotten around to eventually, Ive just been caught up in aligning it vertically for now. Jul 23, 2014 at 19:09

1 Answer 1


The selectRadio area is rendered as a table. If you use layout="lineDirection", the elements go across, while if you use layout="pageDirection", they go up and down (the orientation may depend on the user's language).

To control the size of the entire area, specify a class or id for the selectRadio, and then set its size:

.mySelectRadio {
    width: 100%:

To adjust the labels, use:

.mySelectRadio input[type=radio] + label {
    /* make changes here */

Without too much effort, I was able to make the labels span the entire width, more or less, it's just going to require some more effort. The main point, though, is that you'll need to adjust the table itself first.

  • Just in the styleClass for the selectRadio use "display: inline-block"? if so that didnt work. Or do I need to set it for the label itself, if so how? Jul 23, 2014 at 18:52
  • @user2070057 So I had to basically re-write the answer. The culprit was a table; you need to go after it directly and alter its size before you an affect its interior.
    – sfdcfox
    Jul 23, 2014 at 20:40

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .