totally rookie question I know, but I am trying to change the background colour in bootstrap
i change using
body{background:#ccc;}
which works, i can see the change at the bottom of the page, but the whole page and it’s entire width is still white
within my page all I then have is
<div class="container">
<div class="row">
i have changed the body of container and row respectively but its not those. also tried changing the colour of .wrap as inpection shows its contained in that too, but nothing changes the full background and Im a little stumped as to what is blocking it. - Ive not written any actual code yet, its just the standard install and a roots theme.
anyone know what is going on here? i know it will be something stupid.
I did ask on stack overflow, but I think people have assumed i dont know how to change a colour or inspect an element. I do, but it’s not working.
I want this particular site to look like its a page on a background, rather than full width colour as with my previous one.
On a clean install of Roots with a blank page, changing the body bg color will change the background for everything but the navbar.
Where are you adding this style? I would recommend you change the @body-bg color in your variables.less file and then recompile the LESS to make sure your are not just having trouble overriding the default styles.
2 Likes
just to edit this, what has been happening, it seems, after reinstalling the theme again and starting from scratch ( I had only just started)
was that the whole site seemed to be taking on the styling properties of the header file
a clean install worked, perhaps I had deleted a closing tag somewhere.
On any fresh installation, the first place I start (for style adjustments) is in /assets/less/bootstrap/variables.less. This file sets quite a few of the default/base colors, font-sizes, padding, etc.
For example, to adjust the body background, try adjusting @body-bg in this file.
There are also setting for button colors, navbar default colors, etc. in this file so take a minute and setup your base here. Then, add in your additional styles (or overrides) in /assets/less/app.less. It’s best practice to not touch any of the other bootstrap core files.
I definitely need to get to grips with the less file. - I am spending a lot of my spare time just studying studying studying the languages, 