Bloggdesign guide - Rutor i menyn

Bloggdesign


Det finns säkert många sätt att fixa rutor/boxar i menyn men så här har jag gjort!

1. Börja med att lägga in den här koden under #side i stilmallen

#box {
width: 212px;
padding: 5px 5px 5px 5px;
background: #FFFFFF;
border: 1px solid #FFFFFF;
}


Vill ni att det ska vara skuggor runt rutorna ska ni lägga in den här koden också före }

-moz-box-shadow:0px 0px 15px #888;
box-shadow: 0px 0px 15px #888;


Sen får ni ändra width till hur breda ni vill ha rutorna osv.


2. Ta bort background: #FFFFFF; under #side

Det gör så att hela bakgrunden i menyn försvinner, det kommer se konstigt ut men box-koden kommer att göra att det blir en bakgrund igen!


3. Nästa kod ni ska lägga in ska läggas in i kodmallarna där ni vill ha rutorna

<div id="box">#</div>

# - byts ut mot det ni vill ha i rutorna. Vill ni till exempel ha en profilbild och text om er själva där som jag har i min översta ruta ska koden se ut så här:

<div id="box">
<img src="KOD TILL BILD">
<font face="TYPSNITT" color="FÄRG" size="STORLEK">DIN TEXT
</font>
</div>


För att få mellanrum mellan alla rutorna måst ni lägga in

<br/>
<br/>

4. Lägg in alla koden i alla kodmallarna!

Jag hoppas att det funkar för er, annars får ni säga till vad som blev fel så ska jag se om jag kan komma på vad felet är! Lycka till! :)


20 februari 2012 - Har uppdaterat inlägget då det inte fungerade. Missade att skriva steg 2 men hoppas att det fungerar nu i alla fall, annars vet jag inte vad felet kan vara!




Felicia ♫

åh tack så mycket för hjälpen! :D



sv: haha aa :) allt bra?



Emma

Haft en bra helg? :)



julia

så lite så :) ja det är ju det :D



jennie

sv: allt bra med dej?



Malins fotodagbok ♥

svar: din text i dina inlägg ser jätte konstig ut, så du vet det.



Emelie

tack så jätte mycket för att du sa till det där om blogg-appen, men förstår inte riktigt vart jag ska gå in och ändra? ;o Tack också för inlägget, nu är det dags att vara kreativ :D



julia

ja :D



Emma

Tack för bra tips! Funkade jättebra :)



Sandra

Hej! Jag har fått boxar, men när jag försökte att göra en egen "profil" box så blir det ingen vit bakgrund, vad kan det bero på? :/

Svar: Hej! Mest troligtvis har du inte fått med hela koden :)
Fanny Edfast


Emma

Jag har nu testat detta, och gjort om flera gånger. Första rutan, med profilbild och text, blir bra. Men sedan blir listan med länkarna under "Senaste inlägg" helt konstig. Texten blir för stor, och det blir en "punkt lista". Vad kan detta bero på? :)

Svar: Varför texten blir stor vet jag faktiskt inte men för att få bort "punkt listan" kan du lägga in den här koden:
list-style: none;

någon stans under #side i stilmallen. Så att det tex ser ut så här:

#side {
float: right;
list-style: none;
width: 230px;
margin: 0px;
padding: 5px 5px 5px 5px;
left:0px;
margin-top: -442px;
}


Fanny Edfast


Emma

Okej, tack så mycket för hjälpen, ska testa om det fungerar! :D

Svar: Så lite så! :)
Fanny Edfast



Sandra

Hejsan! Jag har testat det här, och det blir superbra, förutom 2 av boxarna! Senaste inläggen och kategorierna åker ut? Eller hur man ska förklara, du kan gärna titta in! o; Vet du vad jag gör för fel? :(



maja

hej! det funkar jätte bra första boxen om mig men sen resten kommer längst ner i min blogg ock är jäte konstiga några tips ??



Soffi

Jag kan inte få till att det ska vara flera en 1 ruta. det blev bara något enkelt mellanrumm så att det ser ut att det är 2 rutor. problemet med det är att skuggan fortsätter längs kanten på den. Vet du vad det beror på?



KORT INFORMATION:
Design och foto:
» Jag har gjort min design själv
» Jag redigerar mina bilder i Camera raw och Photoshop CS6
» Läs om min kamerautrustning HÄR


Övrigt:
» Du kan alltid mejla mig om det är något, svarar så fort jag kan! -> fannyfredrica.blogg@hotmail.com
» Snälla, läs inlägget innan du frågar vad jag har gjort idag osv.
» Kommentera snällt! Både mot mig och andra som har kommenterat!


Kommentera inlägget här:

Namn:


E-postadress: (syns ej)


URL/Bloggadress:


Kommentar:


RSS 2.0