Boxar i menyn
I gratis design nummer 30 har jag skapat och använt mig av boxar i sidomenyn. Nu tänker jag göra en guide för att visa hur du fixar detta själv.
1. Skapa div-taggar runt de som du vill ha uppdelat i boxar, exempelvis sökrutan eller kategorier.
Gå in i kodmallen och leta reda på det första stället du vill göra till en box
<div class="sidebar-box">
<!-- Här, mellan start- och sluttaggen,
lägger du det du vill ska bli en box -->
</div>
<!-- Här, mellan start- och sluttaggen,
lägger du det du vill ska bli en box -->
</div>
Exempelvis så här:
När menyn är uppdelad som önskas - Spara!
Än syns ingen skillnad
2. Gå in i stilmallen och kopiera in följande kod längst ned. Denna kod styr alltså över hur boxarna ska se ut
.sidebar-box {
background: #FFF; // välj önskad bakgrundsfärg
border: 1px solid #CCC; // detta ger en kantlinje runt boxen som är 1px tjock och i färgen #CCC
margin-bottom: 20px; // under varje box kommer det vara en 'glipa' på 20 pixlar
padding: 10px;
}
background: #FFF; // välj önskad bakgrundsfärg
border: 1px solid #CCC; // detta ger en kantlinje runt boxen som är 1px tjock och i färgen #CCC
margin-bottom: 20px; // under varje box kommer det vara en 'glipa' på 20 pixlar
padding: 10px;
}
Spara och nu är det klart!