Just started using Bootstrap / Symfony - small issue

redrabbit29 · 20 Jan 2017 at 14:53

About 10 years ago I was a web developer hand coding in HTML/css/php all linked to databases and mainly e-commerce. I thought my knowledge of CSS was really good until using Bootstrap. Seen a lot in there I've not seen before

Been using it on my own new personal website and made a ton of progress in a few hours. Also for someone who can't design or make anything look good from the front end I'm really happy.

I have found it difficult to customise though. Eg:

<h4 class="nav navvar-fg navbrand"> <a href...> My Site </a> </h4>
I
But finding the correct part in the css to change it is really difficult as all the styles are meshed line after line, word after word. I guess I can change it for the tag itself by adding style="colour: #cccccc;" or whatever but if it's a global change then I want it in the main css file.

....

Oh also just started using Symfony. Good but found the documentation an absolute nightmare to understand and it's not very comprehensive. Some of the tutorials are saying to use Twig as well... quite a big learning curve but I can see the advantages.

Any one had similar experiences?

planty · 20 Jan 2017 at 15:59

redrabbit29 said:
But finding the correct part in the css to change it is really difficult as all the styles are meshed line after line, word after word. I guess I can change it for the tag itself by adding style="colour: #cccccc;" or whatever but if it's a global change then I want it in the main css file.

Are you currently trying to edit bootstrap's css file?

I would create your own css file that you include in your website where you candefine your own class styles, then add your own css classes/ids to the elements on the page and style them that way.

redrabbit29 · 20 Jan 2017 at 16:12

planty said:
Are you currently trying to edit bootstrap's css file?

I would create your own css file that you include in your website where you candefine your own class styles, then add your own css classes/ids to the elements on the page and style them that way.

I started out grabbing the whole source for a basic theme I liked. This includes the bootstrap.min.css file.

Do you mean that:

A) I should change that to my own css file and just redine or copy all the bits I like and then customise as I go along

Or

B) keep the bootstrap css file but add my own too where I can customise and add my own classes and IDs?

planty · 20 Jan 2017 at 16:45

redrabbit29 said:
B) keep the bootstrap css file but add my own too where I can customise and add my own classes and IDs?

This

gord · 20 Jan 2017 at 16:57

Exactly, load your CSS after the bootstrap framework so that your tweaks have the highest priority.

Also that mess of CSS is because you're looking at a minified version. Also if you took it from another theme you may have grabbed an older version of the framework, something to bear in mind if you ever try to update it or refer to the official documentation on what it can do (which is very useful). See currenty v.3.3.7 - http://getbootstrap.com/

redrabbit29 · 20 Jan 2017 at 17:08

Thanks guys - really useful advice. Enjoying using this as previously got fed up after hours of trying to design and failing miserably. At least now my actual code *looks* nice and actually enjoyable to use and look at.