CODEWITHSUNDEEP
htmlcsstwitter-bootstrap
Faisal Naseer
Faisal Naseer

Reputation: 4248

Adding a separate CSS file in the body

I have provided a template and it contains many CSS files in head and the body is divided into header ,content and footer portions. I want to add to add bootstrap in order to utilize its grid system for its content part. But when ever I add bootstrap.css in head above or below all the style sheets in <head> content part and footer part renders well but my header portion of the body encounter certain design problems as many of the properties in other css files get overridden by its grid system.

All I want to know is, is there any hack I may be able to use the bootstrap.css for the content part?

I have also tried linking the bootstrap file in <body> below the <header> and above the content portion(I know its not a good practice.) . but it also causes the similar problems for the header portion.

Upvotes: 0

Views: 61

Answers (3)

Praveen Puglia
Praveen Puglia

Reputation: 5631

What you can do is make and download a custom bootstrap version from http://getbootstrap.com/customize/ that contains only the grid system and use that CSS in your web app.

Upvotes: 2

arodriguezdonaire
arodriguezdonaire

Reputation: 5562

Try adding !important to the properties that you want to customize in your CSS file.

But the best way I see to solve your issue is modifying the bootstrap.css file adding your configurations and adding !important if necessary

Upvotes: 0

casraf
casraf

Reputation: 21694

No, you can't. You're going to either have to change your markup and adjust the styles accordingly, or use an ID wrapper and change the styles in your CSS to only target <header> under that specific ID.

You're better off adjusting your styles to fit bootstrap, though.

Upvotes: 0

Related Questions