Support » Teman » CSS

  • Jag har lyckats att få ner avståndet mellan menyn och resten av rubriker, bild på första sidan. Helst skulle jag vilja minska avståndet mer…. Någon som vet hur? sen så fungerar det bara på första sidan inte resten av sidorna exempel Galleri

    Har även lyckats byta färg på menyn men de små pilarna är fortfarande röda hur ändrar man färg där.
    Tacksam för hjälp. Provat på den engelska sidan men ej fått svar än 48 tim sen fråga, är lite otålig av mig 🙂
    /Roger

    • Detta ämne redigerades för 4 år, 2 månader sedan av Roger Vikstrom.

    Sidan jag behöver hjälp med: [logga in för att se länken]

Visar 1 svar - 1 till 6 (av 6 totalt)
  • Moderator tobifjellner (Tor-Bjorn Fjellner)

    (@tobifjellner)

    WordPress-hemmapulare, Projektledare, Författare, Översättare och Vänlig Själ

    Om du menar pilarna som visar att det finns en undermeny, så kan du göra dem svarta med följande rad:

    .primary-menu .icon::before, .primary-menu .icon::after {
        background-color:   #000;
    }

    Tryck upp menyn närmare sidstarten:

    .header-inner {
        padding: 1rem 0;
    }

    Komprimera rubrikraderna och få dem att flyta bättre:

    .header-titles .site-title, .header-titles .site-logo, .header-titles .site-description {
        margin: 0;
    }

    Detta är vad jag kan hitta för stunden.

    Trådstartare Roger Vikstrom

    (@roger-vikstrom)

    Det blev mycket bättre.
    hur minskar man avståndet på de andra sidorna, se exempel
    https://www.rvbild.se/skogens-fyrbenta-djur/
    Med vänlig hälsning,
    Roger

    Moderator tobifjellner (Tor-Bjorn Fjellner)

    (@tobifjellner)

    WordPress-hemmapulare, Projektledare, Författare, Översättare och Vänlig Själ

    .singular .entry-header {
        padding: 0;
    }
    Trådstartare Roger Vikstrom

    (@roger-vikstrom)

    tackar för all hjälp var kan man lära sig mer om CSS?

    Sen en sista grej https://www.rvbild.se/om-naturfotograf-roger-vikstrom/
    titeln är kanske väl stor kan man minska den

    • Det här svaret redigerades för 4 år, 2 månader sedan av Roger Vikstrom.
    Moderator tobifjellner (Tor-Bjorn Fjellner)

    (@tobifjellner)

    WordPress-hemmapulare, Projektledare, Författare, Översättare och Vänlig Själ

    Ett ställe jag ständigt återkommer till är https://www.w3schools.com/css/
    Men via Google går det att hitta mycket.
    Sedan kan man i både Firefox och Chrome undersöka html/css för olika sidor och experimentera själv med hur webbläsaren skulle reagera på några extra rader CSS. Det just det jag använder när jag kikar på din webbplats, t.ex. (Högerklicka och ”inspect element” i Firefox)

    Låt oss se vad du har som ”Extra CSS” just nu. Det är enkelt att se eftersom det helt enkelt länkas in på ett visst ställe i din html-kod:

    .entry-content > p:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) {
    max-width: 800px;
    }
    .home #site-content .entry-header {
    padding-top: 0px;
    }
    @media (min-width: 700px) {
    .site-logo img { max-height: 120px; }
    }
    #site-header .primary-menu li a {
    font-size: 22px;
    }
    body:not(.overlay-header) .primary-menu > li > a {
    color: #000;
    }
    /*** screen smaller than 700px ***/
    h1, .heading-size-1 { font-size: 3.6rem; }
    /*** screen between 700px to 1219px ***/
    @media (min-width: 700px) {
    h1, .heading-size-1 { font-size: 6.4rem; }
    }
    /*** screen 1220px and bigger ***/
    @media (min-width: 1220px) {
    h1, .heading-size-1 { font-size: 8.4rem; }
    }
    @media (min-width: 1000px) {
    #site-header > .header-inner {
    flex-direction: column;
    }
    .header-titles-wrapper {
    margin: 3rem 0;
    order: 1;
    }
    .header-titles {
    justify-content: center;
    margin: 0;
    }
    }
    #site-content .entry-header {
    padding-bottom: 0px;
    }
    #site-content .post-inner {
    padding-top: 10px;
    }
    .primary-menu .icon::before, .primary-menu .icon::after {
    background-color:   #000;
    }
    .header-inner {
    padding: 1rem 0;
    }
    .header-footer-group .header-inner {
    padding-bottom: 0px;
    }
    .header-titles .site-title, .header-titles .site-logo, .header-titles .site-description {
    margin: 0;
    }
    .singular .entry-header {
    padding: 0;
    }

    Du får så stor rubrik på sidan du pekar till eftersom du i avsnittet som börjar med /*** screen smaller than 700px ***/ anger ganska stor textstorlek för alla h1-taggar. Jag undrar var du hittade den inställningen någonstans. Tidigare i denna tråd ”målade vi över” den inställningen med en mer specifik CSS-klass (eller snarare kombination av CSS-klasser) för just startsidan. font-size 8.4rem är stort…

    Här är en artikel som berättar mer om hur man kan kombinera klasser/id/taggar för att skapa specifika CSS-regler:
    https://css-tricks.com/multiple-class-id-selectors/

    Någonstans på W3schools tror jag att jag läste om prioriteringsordning för situationer när olika CSS-regler ger motstridiga instruktioner (grundregeln är att ”mest specifik regel vinner”.)

    Trådstartare Roger Vikstrom

    (@roger-vikstrom)

    ok tack så mycket ska kolla in de olika classerna för förstasidan
    tack så mycket för hjälp
    Med vänlig hälsning,
    Roger

Visar 1 svar - 1 till 6 (av 6 totalt)
  • Ämnet ”CSS” är stängt för nya svar.