Question

I am using Rails 3.1 and want to have a Sass variable (or other technique) where I can set

$show_border: border: 1px solid black;

and in layout pieces

.info{
  $show_border
  width: 600px;
  display:inline-block;
  float:left;
}

So that I can see layouts and turn it on and off centrally. I can’t just set border to 0 as that will not work cross browser. Is there a simple way to do this?

thx

Answer 1

You can do it as a mixin, if you want:

@mixin show_border {
  border: 1px solid black;
}

.info {
  @include show_border;
}

Or you can do it in JavaScript (i.e. from a bookmarklet):

$(".info").css({ border: "1px solid black" }); // with jQuery

// Without jQuery (in modern browsers)
Array.prototype.slice.call(document.getElementsByClassName("info"), 0).forEach(function (element) {
  element.style.border = "1px solid black";
});