Pretty baby spin-doktorer http://1apotekonline.com/cialis/ sterling sølv pille kasse

Maxbredd på bilder i inläggen (så att de passar alla designer)

Ibland så skapar man nya designer där content (inläggsdelen) är mindre än vad man har haft tidigare, vilket i sin tur kan resultera i att bilder som laddats upp i större storlek för att passa den gamla designen inte passar den nya. Men, det kan man enkelt lösa med lite CSS i stilmallen.

Stilmallskod:

.entrybody img { 
   max-width: 800px; /* Ändra bredden här */ 
}

 

maxbredd

Från filmen:

Maxbredd på bilderna i inläggen

 

Hej hörni.

Idag så tänkte jag visa er hur man gör ifall man skulle vilja ändra storlek på sin content men har laddat sina bilder i ett större format under en lång period eller en kort period. Säg till exempel att jag skulle vilja ändra min content som idag är ungefär 840 pixlar bred till 640 pixlar bred. Då blir helt plötsligt alla mina bilder alldeles för stora och de kommer att gå utanför. Det jag ska visa er idag är helt enkelt hur man lägger in en kod i stilmallen som gör att alla bilder får en maxbredd.

Vi har en stilmallskod här nedanför och i den så finns det bara en enda egenskap med en enda förklaring. Då har vi max-width och jag har ställt in den på 800 pixlar därför att det är ju det som jag max kan ha. Så om jag har laddat någon bild någon gång som är större än 800 pixlar så kommer den att krympas ihop så att den passar på min nuvarande blog. Man ändrar helt enkelt maxbredden till den bredden man vill ha. Så säg till exempel att man vill ha en maxbredd på kanske 700 pixlar, då ändrar man helt enkelt bara till 700 pixlar så det är inte så mycket svårare än så.

Det ni gör, det är helt enkelt att ni bara går in i er stilmall. Tryck på design, stilmall och så lägger ni bara in den här koden nånstans. Kanske längst ner. Det bestämmer ni själva.

Det var det jag skulle visa er idag så får ni ha det så gott. Hej hej.

24 år, läser till Webbutvecklare, driver eget företag inom design, grafik & SEO samt ett företag som designar posters. På fritiden skapar jag bloggar, hemsidor och gör andra projekt inom webb. Jag har bloggat sedan 2007 under namnet Sannas Rum och har också två egna Youtubekanaler.

Läs mina andra inlägg

11 comments

  1. SvaraEvelina

    Hej! Hittade inget inlägg som passade ordentligt så jag ställer min fråga här. Jag har precis breddat min blogg från 606px till 820px på content. Nu vill jag flytta in texten så att den börjar och slutar ca 50px från kanterna. Vilket jag förstått är under padding på entrybody? Men när jag ändrar värdet där så förskjuts bilderna ut till höger istället för att gå kant i kant med inläggssidan. Jag har sökt runt på nätet och hittat en kod som heter:

    .entrybody img {
    margin-left: -23px;
    }

    Det står att man ska lägga in den koden under entrybody vilket jag gjort och provat lite olika värden på margin-left. Trots detta så händer inget alls med bilden. Den förskjuts fortfarande och det enda värdet där den ligger rätt är om jag har padding på 20px. Finns det någon annanstans där jag måste ändra något värde? Ska jag skita i den där koden jag hittat på nätet eller hur ska jag göra för att det ska fungera?
    Jättetacksam för svar!

    Mvh Evelina


    1. Author
      SvaraSanna Preifelt

      Du får öka värdet på koden, alltså plussa på 50px så det blir -73, då ska det fungera 🙂

      1. Evelina

        Har provat det förut men det funkade inte. Testade nu med men samma resultat. Nu sparade jag ändå så att du kan se hur det ser ut. Klistrar även in koden här nedan ifall du kan se om jag lagt den helt fel.

        /** Post's body text **/
        .entrybody {
        font-family: calibri, arial, sans-serif;
        font-size: 14px;
        font-weight: normal;
        color: #666666;
        line-height: 140%;
        text-align:justify;
        padding:50px;
        margin: 0px 0px 0px 0px;
        }
        .entrybody img {
        margin-left: -73px;
        }

        Tack för att du tar dig tid!


      2. Author
        Sanna Preifelt

        Prova att skriva !important efter -73px och justera sedan antalet pixlar 🙂 Såhär:

        .entrybody img {
           margin-left: -73px !important;
        }
  2. SvaraSandra

    Hej!
    Jag visste inte riktigt vart jag skulle ställa frågan så jag lånar det här inlägget.
    Det är som så att jag har lite problem med att ställa in på mina inlägg, jag vill ha en väldigt bred blogg så att det går att lägga in fullstora bilder, 1000px, men samtidigt vill jag ha texten mer “ihoptryckt” så att den börjar och slutar ca 200px in från kanterna. Har provat ändra i content (hittar banne mig ingen .entrybody i de nya mallarna, vad är det istället?!) men det slutar bara med att bilderna förminskas så de också passar in i de där “200px-från-kanten”…

    Jag har både provat att göra i blogg.se´s Essentials (har även tagit den där länken och ersatt den med allt som ligger i den, men då försvinner ju typsnitten?) och att ta en vanlig utan någonting inlagt nästan, men det blir lika på båda och ingen .entrybody någonstans.

    Hoppas att det finns någon lösning på mitt problem, för jag sliter snart av mitt hår i förtvivlan för att alla mina försök misslyckas!
    Tack på förhand!
    /Sandra

  3. SvaraFlizan

    Går det att centrera bilder i inlägg via stilmallen? Jag har en blogg som är 740 px bred och jag har väldigt varierande storlek på mina bilder, så en kod som sätter bilderna på 740 som fast bredd “förstör” mina mindre bilder. Dock glömmer jag alltid bort att centrera bilderna i inläggen och jag skulle gärna ha en kod som gör det automatiskt (blir så mye snyggare så), men jag lyckas inte oavsett vilka kombinationer jag provar…

Lämna ett svar

E-postadressen publiceras inte. Obligatoriska fält är märkta *