SitePoint Sponsor

User Tag List

Results 1 to 9 of 9

Thread: Checkbox size

  1. #1
    SitePoint Zealot
    Join Date
    Sep 2009
    Posts
    117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Checkbox size

    Howdy. I've a checkbox that is reasonable size in FF but in IE it's very small. I've tried resizing with css but that doesn't work. Anyone have any experience with this?

    Thanks

  2. #2
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,721
    Mentioned
    8 Post(s)
    Tagged
    0 Thread(s)
    Are you trying to style it at all? Leave them unstyled in browsers because they weren't meant to be styled.

    That being said, we will need a site to look at where we can look at the issue .

    If a site is unable to be posted (which would speed up the debvugging process if we did have a site) then we need full HTML and CSS to reproduce it on our end.
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  3. #3
    SitePoint Zealot
    Join Date
    Sep 2009
    Posts
    117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm working locally. It's a simple label/checkbox in a form
    Code:
    <form>
    <label class="rem_me"><input name="rememberme" id="rememberme" type="checkbox" value="forever" /> Remember me</label>
    </form>
    Here is the css for the label.
    Code:
    div#log_reg label.rem_me {
    	margin: 10px auto 15px;
    	height:15px;
    	border:1px solid red;
    }
    The checkbox is 15px X 15px in FF 3.5.7 and about 5px X 5px in IE 8

    Thanks

  4. #4
    SitePoint Guru Luki_be's Avatar
    Join Date
    Jun 2008
    Location
    Brazil, Minas Gerais. But i'm from Belgium.
    Posts
    867
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That piece of code renders the same in Opera, FF, IE6, IE7 and IE8 locally for me. Maybe there's something else going on in the rest of your code?

    Any chance of the full HTML and CSS, like Ryan suggested?
    SitePoint Guru
    Sitepoint - the ultimate Css well
    As a computer, I find your faith in technology amusing.
    Sitepoint reference, your friend in need

  5. #5
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,721
    Mentioned
    8 Post(s)
    Tagged
    0 Thread(s)
    Checkboxes weren't meant to be styled and I'm afraid that styling them basically at all won't produce the results you desire.

    You could meddle in JS to achieve this, but pure CSS alone won't get you waht you want
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  6. #6
    SitePoint Zealot
    Join Date
    Sep 2009
    Posts
    117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for the quick responses. Since I'm one not to give up easily Luki_b has driven me to look at my code to track to the offending code before I bother you guys any further. I'll try one more time before posting all the code. Thanks again.

    Ryan
    Checkboxes weren't meant to be styled and I'm afraid that styling them basically at all won't produce the results you desire.
    I wasn't aware of this limitation. Thanks!

  7. #7
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,721
    Mentioned
    8 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Tsalagi View Post
    Thanks for the quick responses. Since I'm one not to give up easily Luki_b has driven me to look at my code to track to the offending code before I bother you guys any further. I'll try one more time before posting all the code. Thanks again.

    Ryan I wasn't aware of this limitation. Thanks!
    It's not just checkboxes, other form elements as well! <select>/<option>'s as well
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  8. #8
    SitePoint Member
    Join Date
    Feb 2010
    Posts
    1
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Tsalagi,

    Hope you fixed the issue. I was having the same problem here. Thanks to Ryan for his suggestions also. I had to take out the styles to get it done.

  9. #9
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,475
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    Quote Originally Posted by Tsalagi View Post
    Ryan I wasn't aware of this limitation. Thanks!
    Have a look at this article which shows the differences between browsers where form controls are concerned.

    Chances are that if you are applying a style correctly and it is not showing then that browser does not allow you to change that property on a form control.

    As others have said it's best to leave form controls alone especially check boxes, radio buttons and selects. Other form elements such as text boxes, textareas and submits can be styled a bit better but there are still limits between browsers.

    A lot of the styling of form controls is done by the browser and can't be easily over-ridden.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •