I want to make the footer two small columns on a mobile device instead of one. i just seem to have a lot of white space otherwise -
could anyone advise where i create the css for this - as far as i see once it drops below 768 it changes to one col-lg-12
You can change classes for each widget section here.
Personally, I would add a duplicate sidebar for the second column (duplicating the register_sidebar code for the footer sidebar) and then keep the markup in the template itself.
I dont think I explained well enough - main layout is four column widgetized footer - its already set up in the way you linked above -
just the col-sm-3 collapses at 768px to full width.
however I did work out that all i had to do was change the width percentage and float it left again and it was all fine!
There’s extra small columns (col-xs-*) for grids under 768px. Check the Bootstrap docs for more details.