CODEWITHSUNDEEP
jquerycsstwitter-bootstrap
Shalkam
Shalkam

Reputation: 783

How to set a container element for bootstrap style

I am in a situation where I am developing templates for a component for Joomla!. And I need to have twitter bootstrap selector limited to my component and not affect the rest of the page layout. What I do for now is modify every selector in bootstrap and add my container like this :

#SobiPro button::-moz-focus-inner,
#SobiPro input::-moz-focus-inner {
  padding: 0;
  border: 0;
}
#SobiPro button,
#SobiPro html input[type="button"],
#SobiPro input[type="reset"],
#SobiPro input[type="submit"] {
  cursor: pointer;
  -webkit-appearance: button;
}
#SobiPro label,
#SobiPro select,
#SobiPro button,
#SobiPro input[type="button"],
#SobiPro input[type="reset"],
#SobiPro input[type="submit"],
#SobiPro input[type="radio"],
#SobiPro input[type="checkbox"] {
  cursor: pointer;
}

So, Is there a solution in css or javascript to set the parent container for a css file except adding it to every selector?

regards, Mostafa

Upvotes: 1

Views: 131

Answers (1)

Shalkam
Shalkam

Reputation: 783

So, no one answered and after a couple of years i've managed to find the answer. So, it can be done using less to css converter ( you can find a lot of online less to css converter ) this way :

.your_container_selector {
   /* css code that needs to be wrapped in that container */ }

then convert this code from less to css.

Upvotes: 2

Related Questions