03. Front-end

Hjälp med else & if-satser

2015-09-01 20:53 #0 av: Deviance

Hej!

Skulle behöva svar/hjälp med en liten grej. Använder mig av blogg.se och undrar om det på något sätt skulle gå att lägga en if/else för att öka margin mellan varje inlägg. Har just nu margin-top: 30px; på h3 (inläggsrubrikerna) och det ser bra ut mot annonsen och med adblock aktiverat. Det ser däremot väldigt tight ut mellan två inlägg om det inte ligger en annons mitt i mellan. Problemet är ju att det inte finns en synlig kod för annonsen i HTML dokumentet och det inte heller är en annons mellan varje inlägg. Går det ändå på något vis att försöka styra så att "else" annons så använd 80px margin top eller liknande?

Så här ser avsnittet i kodmallen ut för annonsen.

(endfor satsen här tillhör inte annonsen)

Anmäl
2015-09-02 09:36 #1 av: yeahsica

Om det är bloggen du länkar till i din profil du vill ha hjälp med, kan du istället använda CSS för att få det som du vill. Lägg till det här i din CSS:

hr + div[class=entrytop] {
margin-top: 80px !important;
}

och sedan:
.entrytop {
margin-top: 30px;
}

Översta koden väljer ut alla div:ar som har klassen entrytop, som kommer direkt efter en hr. Varje gång du inte har en annons kommer detta att vara uppfyllt och margin-top bli 80px istället för 30px.


Anmäl
2015-10-07 00:05 #2 av: Deviance

Har uppdaterat designen nu men har återigen samma problem haha. Har lagt margin-bottom på entrybox nu men tycker det är för litet mellanrum.

#1 Vad innebär en hr i detta fallet? Jag försökte lägga in koden men bytte ut entrytop till entrybox men det fungerade inte heller.

Anmäl
2015-10-07 09:59 #3 av: yeahsica

Hr i koden jag skrev i #1 är en <hr>-tagg (blir som en avskiljningslinje). Den fanns med i din förra design. I den här nya designen ser inte koden likadan ut, men du skulle kunna skriva t.ex. såhär istället:

script + div[class=entrybox] {
margin-top: 0px !important;
}

.entrybox {
margin-top: 100px;
}

.entrybox:first-of-type {
margin-top: 0px;
}

Den här koden betyder ungefär; när du har en annons innan entrybox sätt margin-top till 0 px och när du inte har en annons innan entrybox, sätt margin-top till 100px. First-of-type-kodstycken gör att översta inlägget har margin-top 0px, annars hade det fått margin-top 100px. 

Den här koden går att göra snyggare/bättre, men jag känner mig för seg i huvudet för att orka tänka ut det nu (är förkyld), hoppas det hjälper lite ändå :) 


Anmäl
2015-10-07 13:18 #4 av: Deviance

Tack! Du är en hjälte :''')

First of type var precis vad jag har letat efter tidigare men jag hade helt glömt bort vad det hette,  visste bara att jag använt det för något år sen till något annat haha

Anmäl
2015-10-07 16:09 #5 av: yeahsica

#4 Inga problem, varsågod! Haha, vad kul, vilken tur att det råkade komma upp här då ;)


Anmäl

Bli medlem på iFokus

För att kunna delta i diskussionen måste du bli medlem på iFokus. Det går snabbt, enkelt, och kostar ingenting. Medlemskapet ger dig tillgång till över 300 sajter.