Floating Facebook Widget
forsiden webdesign grafikk guider guider
Forsiden » Webdesign » Blogg.no » HTML og CSS » Skille sidemenyen fra blogginnlegg/få smal blogg

Skille sidemenyen fra blogginnlegg/få smal blogg

Her skal jeg lære deg hvordan du får mellomrom mellom sidemenyen og blogginnleggene. Denne kan du også bruke for å få en smal blogg! Det er ikke bare en eneste kode. Med denne får du litt flere muligheter for å bestemme hvordan du vil ha det.

Her er selve kodene som du skal lime inn i stilsettet og eventuelt endre på om du vil det.

#wrapper {
background-color: transparent;
width: 950px;
}
#main {
float: left;
padding: 5px;
width: 635px;
background-color: #ffffff;
border: 0px solid #000000;
}
#side {
float: right;
padding: 5px;
width: 285px;
background-color: #ffffff;
border: 0px solid #000000;
}

Hvis f.eks dette står i stilsettet fra før, så må du fjerne det. Det gjelder også #side og #main.

#wrapper {
background-color: #fff;
}

Du kan endre det som står etter width om du vil at bloggen skal være bredere eller smalere. Gjør du #main eller #side bredere, må du gjøre #wrapper bredere. Hvis sidemenyen flytter seg ned, så må du gjøre #main eller #side smalere, eller gjøre #wrapper bredere.

#main er blogginnleggene og #side er sidemenyen.

Om ting ikke ser helt bra ut, så kan du legge til denne koden nederst i stilsettet

#doc2 { margin: 0px; padding: 0px; width: 100%; }

PS: Det kan være lurt å velge «bygg ditt eget design» før du bruker disse kodene da jeg ikke vet hva du har i stilsettet ditt fra før.

23 kommentarer

Emily 20. juni 2011, kl. 17:47

Jeg lurer bare på hvorfor headeren min blir litt skeiv når jeg bruker denne koden?? :)

Emily 20. juni 2011, kl. 19:42

Nå har jeg endre på størrelsen, men på høyre siden av headeren vil den ikke være på linje med sidemenyen og bloggen. :)

Emily 21. juni 2011, kl. 08:08

Tusen. tusen TAKK!! Nå er den suuper! Du er kjmepeflink :D TAKK; TAKK!

eia 25. juni 2011, kl. 23:25

hvordan kan jeg dele blogginnleggene inn i bokser? :)

Ingrid 27. juni 2011, kl. 17:40

Hvordan får man større mellomrom mellom menyen og innleggene? Hadde vært fint om du kunne svart på min blogg :)

Åshild :-) 03. juli 2011, kl. 21:28

Hei! :-)
Jeg sliter med det samme…headeren og resten av bloggen vil ikke være på linje, og det hjelper ikke å endre størrelsen på headeren, kan du hjelpe meg? :-)

    Lisa 04. juli 2011, kl. 17:28

    Først må du legge til et slikt tegn } på slutten av stilsettet fordi du mangler det. Så kan du legge inn dette:
    #doc2 { margin: 0px; padding: 0px; width: 100%; }

Comanche 08. juli 2011, kl. 22:23

Hei, kodene dine er kjempebra! må bare si det! :)
men lurer på to ting:
1. Har du en kode som får sidemenyen til å stå stille?
2. Hvordag går det an å få sidemenyen lengere? :)

Jenny Kristine 20. juli 2011, kl. 19:10

Headeren min ligger lengre til venstre enn det innleggene mine er… Hvordan endrer jeg på det?

madelenelisella. 04. august 2011, kl. 02:29

Jeg tror jeg sliter med det samme som jenny over her, altså ting er ikke på linje, skulle gjerne hatt flytta innleggene og sidemenyen litt til venstre… noen tips? :)

Johanne 17. august 2011, kl. 12:02

I safari så er designet mitt perfekt, men i chrome så ser du at det er hvit bakrund i mellomrommet, og nedover sidemenyen. Hva skal jeg gjøre?

Carina 23. august 2011, kl. 15:51

Jeg har sagt det før, men sier det igjen: tusen takk! Du er genial. Jeg har lært masse, masse fra deg (du har blitt min webdesign-lærer). Det var den koden helt på slutten der jeg trengte (#doc2 { margin: 0px; padding: 0px; width: 100%; }) og som jeg har lett så utrolig mye etter. Og vips! her var den! Thank u! :)

Emilie Husmo 26. august 2011, kl. 15:56

så fin blogg. Mn jeg kan ikke endre bredden på selve bloggen. Hjelp meeg! :)

Vilde Birgitte 07. september 2011, kl. 14:53

Får en hvit bakgrunn i mellomrommet, hvordan får jeg det bort?

Amanda 13. oktober 2011, kl. 15:04

Det kom bare der det sto om oss og profilbilde og sånt. Men ikke kategorier, siste komentar osv! Hvorfor skjer det?

Stine 22. oktober 2011, kl. 00:50

Du har en veldig fin side som har hjulpet meg masse nå når jeg har lagd nytt design. Tusen takk, du er utrolig flink!
Jeg har selvfølgelig linket til deg i et innlegg om hvor jeg fant koder og sånn :)

Ann Kristin Rimol 16. mars 2012, kl. 22:08

Hei :D Hvordan får man bloggen større? Når jeg endrer på lengden, blir sidemenyen på bunnen av bloggen….

ida 31. mai 2012, kl. 23:43

det man kan gjøre for og få sidemenyen opp i gjenn, er å enten gjøre sidemenyen mindre, eller wrapper større :)

thao 02. juni 2012, kl. 16:17

Hei! Jeg lurer på en ting. I designet, vet du hvordan man fjerner den «dottete» linja mellom sidemenyen og innleggene? jeg vil bare fjerne den dottete linja, men jeg får det ikke til. Håper du skjønner hva jeg mener :)

thao 03. juni 2012, kl. 00:01

SV: den koden står faktisk ikke i CSS-stilsettet mitt, så da aner jeg ikke hvordan jeg skal fjerne den linja….

Marit Røkenes 08. november 2012, kl. 16:56

Hei! Jeg har et ørlite problem. Jeg er akkurat ferdig med designet mitt og har publisert det på bloggen min, men problemet er at når jeg zoome inn og ut flyter sidemenyen dit den selv vil, altså over main. Jeg opplever også at folk med mindre skjermoppløsning ikke får sett hele innlegget pga. dette. Har har funnet ut at jeg må legge side under wrapper på en eller annen måte, men jeg vet ikke hvordan. Hjelp?

Skriv en kommentar

E-postadressen din vil ikke bli publisert. Påkrevde felt er markert med *.

*


Du kan bruke disse HTML-kodene og -egenskapene: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Søk

 

Nerdie.me Design Proudly powered by WordPress