MyBB Community Forums - Need Some Help with css I think?

I found this and was trying to add it to mybb
http://www.maratz.com/blog/archives/2006...o-buttons/

But I can not get it to look right
[attachment=28268]
If i mess with padding I can get to look ok but then it mess this up
[attachment=28269]

I spent a couple of hours trying to get it to look right but I could not get it the way i wanted
So I am hoping some will be able to help me

my site howman(DOT)ca

Find in css:

.has-js .label_radio    { padding-left: 34px; }

Reduce the 34px to 24px or something suitable.

(2013-01-11, 05:33 AM)effone Wrote: [ -> ]Find in css:
.has-js .label_radio    { padding-left: 34px; }
Reduce the 34px to 24px or something suitable.

Thank you for your help effone I reduced it but it still looks off but it is better
the post Icons look the most out of place.
Post Options: and Moderator Options: spacing looks odd they do not line up

the forumdisplay check boxes are not center but do not look to bad

I guess you have to bind different radio / check groups with different additional classes and adjust padding as per requirement. I guess you are getting what I'm trying to say ...

Example:

Modify the classes in template and define in CSS like this:

.has-js .label_radio_postbit { padding-left: 24px; }
.has-js .label_radio_moderate { padding-left: 18px; }
.has-js .label_radio_search { padding-left: 22px; }

(2013-01-11, 06:52 AM)effone Wrote: [ -> ]I guess you have to bind different radio / check groups with different additional classes and adjust padding as per requirement. I guess you are getting what I'm trying to say ...

Example:

Modify the classes in template and define in CSS like this:

.has-js .label_radio_postbit { padding-left: 24px; }
.has-js .label_radio_moderate { padding-left: 18px; }
.has-js .label_radio_search { padding-left: 22px; }

Thank you again effone I will give this a try tomorrow as its 2 am and i should be in bed
I will post again and let you know how it went

(2013-01-11, 06:57 AM)Howman Wrote: [ -> ]
(2013-01-11, 06:52 AM)effone Wrote: [ -> ]I guess you have to bind different radio / check groups with different additional classes and adjust padding as per requirement. I guess you are getting what I'm trying to say ...

Example:

Modify the classes in template and define in CSS like this:

.has-js .label_radio_postbit { padding-left: 24px; }
.has-js .label_radio_moderate { padding-left: 18px; }
.has-js .label_radio_search { padding-left: 22px; }

Thank you again effone I will give this a try tomorrow as its 2 am and i should be in bed
I will post again and let you know how it went

It did not work but I guess this would have to be changed to work for the different classes but not quite sure how

    function setupLabel() {
        if (jQuery('.label_check input').length) {
            jQuery('.label_check').each(function(){ 
                jQuery(this).removeClass('c_on');
            });
            jQuery('.label_check input:checked').each(function(){ 
                jQuery(this).parent('label').addClass('c_on');
            });                
        };
        if (jQuery('.label_radio input').length) {
            jQuery('.label_radio').each(function(){ 
                jQuery(this).removeClass('r_on');
            });
            jQuery('.label_radio input:checked').each(function(){ 
                jQuery(this).parent('label').addClass('r_on');
            });
        };
    };
    jQuery(document).ready(function(){
        jQuery('body').addClass('has-js');
        jQuery('.label_check, .label_radio').click(function(){
            setupLabel();
        });
        setupLabel(); 
    });

I think I figured it out I got it to go I just messed with the jQuery a bit

Thank you effone