• Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other Pie Elite all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Jeanne Boyarsky
  • Ron McLeod
  • Paul Clapham
  • Liutauras Vilda
Sheriffs:
  • paul wheaton
  • Rob Spoor
  • Devaka Cooray
Saloon Keepers:
  • Stephan van Hulst
  • Tim Holloway
  • Carey Brown
  • Frits Walraven
  • Tim Moores
Bartenders:
  • Mikalai Zaikin

css checkbox style

 
Ranch Hand
Posts: 181
3
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
I have a check box in my table.
this is css of that checkbox



but it shows as this image(normal checkbox)


I want to change the border color of that checkbox.
but it doesn't work!!!

can someone help me??
 
Marshal
Posts: 28177
95
Eclipse IDE Firefox Browser MySQL Database
  • Likes 1
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
For those who want to see the image in question, you can see it by following this link: https://drive.google.com/file/d/0B4BwhfTH4UEgYUJjcUlpRXFNeGM/view

Also I'm pretty certain that CSS isn't one of the topics covered by the OCPJP so I'll move this post to the HTML, CSS and JavaScript forum, where it will feel right at home.
 
Ranch Hand
Posts: 98
Angular Framework Chrome Linux
  • Likes 1
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Hi Chamini,

Please use outline css property in order to apply border effect. like below. Make your checkbox width and height as auto

 
chamini prashakthi
Ranch Hand
Posts: 181
3
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
That means we can't use border keyword here ???

**Dinesh Kumar Ramakrishnan it is no problem to use my own height and weight.I checked.
Your answer is work.Thnkyou!!!
 
Dinesh Kumar Ramakrishnan
Ranch Hand
Posts: 98
Angular Framework Chrome Linux
  • Likes 1
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator

chamini prashakthi wrote:That means we can't use border keyword here ???

**Dinesh Kumar Ramakrishnan it is no problem to use my own height and weight.I checked.
Your answer is work.Thnkyou!!!



Yes you can use only outline or boxshadow to get border.
 
chamini prashakthi
Ranch Hand
Posts: 181
3
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
if i do this kind of thing it is work

but for this thing it doesn't work



why is that??
 
Dinesh Kumar Ramakrishnan
Ranch Hand
Posts: 98
Angular Framework Chrome Linux
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator

chamini prashakthi wrote:if i do this kind of thing it is work

but for this thing it doesn't work



why is that??



for boxshadow we need to give h-shadow,v-shadow values(example  box-shadow: 10px 10px 5px #888888;). The same border property value won't work. Please find box-shadow example below.

http://www.w3schools.com/cssref/css3_pr_box-shadow.asp
 
chamini prashakthi
Ranch Hand
Posts: 181
3
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
background-color is not work for the checkbox.
Isn't it??
 
Dinesh Kumar Ramakrishnan
Ranch Hand
Posts: 98
Angular Framework Chrome Linux
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator

chamini prashakthi wrote:background-color is not work for the checkbox.
Isn't it??



Checkbox wont support background-color. You should use label background or :before and :after  pseudo elements to change the appearance.


Please post your full requirement with sample code in jsfiddle.
 
With a little knowledge, a cast iron skillet is non-stick and lasts a lifetime.
reply
    Bookmark Topic Watch Topic
  • New Topic