You are here

Home » API reference » Fivestar 5

fivestar.css in Fivestar 5

Same filename and directory in other branches
  1. 8 css/fivestar.css
  2. 6.2 css/fivestar.css
  3. 6 css/fivestar.css
  4. 7.2 css/fivestar.css
/* Plain HTML Version */
form.fivestar-widget {
  clear: both;
  display: block;
}
form.fivestar-widget select,
form.fivestar-widget input {
  margin: 0;
}

/* Combo Static and Rate Widget */
.fivestar-combo-stars .fivestar-static-form-item {
  float: left; /* RTL */
  margin-right: 40px; /* RTL */
}
.fivestar-combo-stars .fivestar-form-item {
  float: left; /* RTL */
}

/* Fivestar form items */
.fivestar-static-form-item .form-item,
.fivestar-form-item .form-item {
  margin: 0;
}

/* Static View-only Star Version */
div.fivestar-widget-static {
  display: block;
}

div.fivestar-widget-static br {
  clear: left; /* RTL */
}

div.fivestar-widget-static .star {
  float: left; /* RTL */
  width: 17px;
  height: 15px;
  overflow: hidden;
  text-indent: -999em;
  background: url(../widgets/default/star.gif) no-repeat 0 0px;
}

div.fivestar-widget-static .star span.on {
  display: block;
  width: 100%;
  height: 100%;
  background: url(../widgets/default/star.gif) no-repeat 0 -32px;
}

div.fivestar-widget-static .star span.off {
  display: block;
  width: 100%;
  height: 100%;
  background: url(../widgets/default/star.gif) no-repeat 0 0px;
}

/* Javascript Star Version */
div.fivestar-widget {
  display: block;
}

div.fivestar-widget .cancel, div.fivestar-widget .star {
  float: left; /* RTL */
  width: 17px;
  height: 15px;
  overflow: hidden;
  text-indent: -999em;
}
div.fivestar-widget .cancel, div.fivestar-widget .cancel a {
  background: url(../widgets/default/delete.gif) no-repeat 0 -16px;
  text-decoration: none;
}

div.fivestar-widget .star, div.fivestar-widget .star a {
  background: url(../widgets/default/star.gif) no-repeat 0 0px;
  text-decoration: none;
}

div.fivestar-widget .cancel a, div.fivestar-widget .star a {
  display: block;
  width: 100%;
  height: 100%;
  background-position: 0 0px;
  cursor: pointer;
}

div.fivestar-widget div.on a {
  background-position: 0 -16px;
}
div.fivestar-widget div.hover a, div.rating div a:hover {
  background-position: 0 -32px;
}
form.fivestar-widget div.description {
  margin-bottom: 0;
}

File

css/fivestar.css
View source 
  1. /* Plain HTML Version */

  2. form.fivestar-widget {

  3.   clear: both;

  4.   display: block;

  5. }

  6. form.fivestar-widget select,

  7. form.fivestar-widget input {

  8.   margin: 0;

  9. }

  10. 

  11. /* Combo Static and Rate Widget */

  12. .fivestar-combo-stars .fivestar-static-form-item {

  13.   float: left; /* RTL */

  14.   margin-right: 40px; /* RTL */

  15. }

  16. .fivestar-combo-stars .fivestar-form-item {

  17.   float: left; /* RTL */

  18. }

  19. 

  20. /* Fivestar form items */

  21. .fivestar-static-form-item .form-item,

  22. .fivestar-form-item .form-item {

  23.   margin: 0;

  24. }

  25. 

  26. /* Static View-only Star Version */

  27. div.fivestar-widget-static {

  28.   display: block;

  29. }

  30. 

  31. div.fivestar-widget-static br {

  32.   clear: left; /* RTL */

  33. }

  34. 

  35. div.fivestar-widget-static .star {

  36.   float: left; /* RTL */

  37.   width: 17px;

  38.   height: 15px;

  39.   overflow: hidden;

  40.   text-indent: -999em;

  41.   background: url(../widgets/default/star.gif) no-repeat 0 0px;

  42. }

  43. 

  44. div.fivestar-widget-static .star span.on {

  45.   display: block;

  46.   width: 100%;

  47.   height: 100%;

  48.   background: url(../widgets/default/star.gif) no-repeat 0 -32px;

  49. }

  50. 

  51. div.fivestar-widget-static .star span.off {

  52.   display: block;

  53.   width: 100%;

  54.   height: 100%;

  55.   background: url(../widgets/default/star.gif) no-repeat 0 0px;

  56. }

  57. 

  58. /* Javascript Star Version */

  59. div.fivestar-widget {

  60.   display: block;

  61. }

  62. 

  63. div.fivestar-widget .cancel, div.fivestar-widget .star {

  64.   float: left; /* RTL */

  65.   width: 17px;

  66.   height: 15px;

  67.   overflow: hidden;

  68.   text-indent: -999em;

  69. }

  70. div.fivestar-widget .cancel, div.fivestar-widget .cancel a {

  71.   background: url(../widgets/default/delete.gif) no-repeat 0 -16px;

  72.   text-decoration: none;

  73. }

  74. 

  75. div.fivestar-widget .star, div.fivestar-widget .star a {

  76.   background: url(../widgets/default/star.gif) no-repeat 0 0px;

  77.   text-decoration: none;

  78. }

  79. 

  80. div.fivestar-widget .cancel a, div.fivestar-widget .star a {

  81.   display: block;

  82.   width: 100%;

  83.   height: 100%;

  84.   background-position: 0 0px;

  85.   cursor: pointer;

  86. }

  87. 

  88. div.fivestar-widget div.on a {

  89.   background-position: 0 -16px;

  90. }

  91. div.fivestar-widget div.hover a, div.rating div a:hover {

  92.   background-position: 0 -32px;

  93. }

  94. form.fivestar-widget div.description {

  95.   margin-bottom: 0;

  96. }