Nie mogłem znaleźć w stylu .content i dlatego nie wiem gdzie przypisać margines czy padding.
Jak nie mogłeś? Otworzyłeś w ogóle link do jsbin który wcześniej wkleiłem?
"szansa na ciut mniejsze WTF osoby która to potem dostanie" << tzn?
Mało kto lubi bawić się w style, m. in. dlatego, że bardzo łatwo narobić tam sporego gówna, co mnóstwo ludzi robi (chociaż jak się przekonałem to konsekwentne trzymanie się BEM, SMACSS i do tego LESS/SASS użyty sensownie (np. @media w klasie, nie w jakimś innym miejscu, nie na końcu pliku. Jeden plik = jedna klasa bazowa itp.) dają bardzo dobre efekty i nie robi się z tego straszny potworek). Jak pozostawiasz sporo rzeczy, które wyglądają jak fix do fixa robiony na szybko przez osobę początkującą to potem ktoś kto do tego siądzie nie będzie miał lekko, bo jakaś zmiana będzie pociągać za sobą konieczność zrobienia jeszcze kilku poprawek, które spowodują kolejne problemy itd.
To jak zrobić z tego jednego diva?
Opakować je divem = dodać dla nich element nadrzędny, który je w sobie zawiera, np.
<nav class="jakas_klasa_1">
...zawartosc
</nav>
<div class="jakas_klasa_2">
...zawartosc
</div>
zmieniasz na
<div class="jakas_klasa">
<nav class="jakas_klasa_1">
...zawartosc
</nav>
<div class="jakas_klasa_2">
...zawartosc
</div>
</div>
Dzięki czemu zamiast pozycjonować osobno dwa elementy pozycjonujesz jeden(jakas_klasa) i w nim układasz elementy. Jak dojdzie np. kolejny poziomy element to dodasz go w htmlu i naniesiesz style grafika, nie trzeba będzie również jemu ustawiać position: fixed, kombinować z pozycjonowaniem go itp.