search

itpastorn / webbutveckling-1-flex-studentfiles

Detta är filer som hör ihop med böckerna Webbutveckling 1, lärobok och arbetsbok, 2016-års upplaga och senare.
14 stars 218 forks source link

Läxhjälpen Kap 11 - Saknar css-kod #27

Open Isark2 opened 7 years ago

Isark2 commented 7 years ago

När man följt kapitel 11 för uppgift 11C så ser inte sidan komplett ut. Ignorera outlines. Det nämns angående att header och footer ska vara 100% bredd, men ingen instruktion som visar processen för när man bör göra det. Samt att den första delen för .subpage saknas helt.

Det kan man fixa genom att lägga till följande i css filen:

.subpage {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.subpage header, .subpage footer {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
}
itpastorn commented 7 years ago

Tack för din feedback

itpastorn commented 7 years ago

I mitt "facit" har jag följande regler för body och header och footer som gör samma saker. Det verkar inte framgå av boken.

body {
    margin: auto;
    max-width: 860px;
    font-family: "Helvetica Neue", "Liberation Sans", Calibri, Arial, sans-serif;
    font-size: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
body > header,
body > footer {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
}