Einar Örn
Getur einhver klár vefsíðu/CSS nörd hjálpað okkur aðeins?
Ég þarf að vita af hverju það kemur alltaf hvítt bil fyrir neðan myndina af Klopp þegar að maður skoðar Kop.is á mjóum skjá (til dæmis á síma)? Þetta fer lygilega mikið í taugarnar á mér.
Og einnig – í þröngu útgáfunni af síðunni, hvað veldur því að leitarboxið og menu-ið fara yfir hvort annað? Við notumst við Twenty Thirteen þemað frá WordPress og í upprunalegu útgáfunni gerist það ekki – en ég veit ekki hvað ég gerði til að breyta þessu á Kop.is. Þið megið endilega setja inn lausnir á þessu sem komment eða á tölvupósti á einarorn@gmail.com
Takk takk!
Í style.css undir
@media (max-width: 767px)
bættu við
.site-header .home-link {
min-height:100px;
}
og undir @media (max-width: 643px)
bættu við
.main-navigation{
margin:0 0px;
}
TAKK! Ein spurning í viðbót – hvernig tek ég þennan rauða lit, sem kemur utan um “Valmynd” kassann þegar að síðan er svona lítil?
Ég breytti bara litnum:
—————————————
/* Buttons */
button,
input[type=”submit”],
input[type=”button”],
input[type=”reset”] {
background: #313131; /* Old browsers */
background: -webkit-linear-gradient(top, #313131 0%, #313131 100%); /* Chrome 10+, Safari 5.1+ */
background: linear-gradient(to bottom, #313131 0%, #313131 100%); /* W3C */
border: none;
border-bottom: 3px solid #000;
border-radius: 2px;
color: #fff;
display: inline-block;
padding: 11px 24px 10px;
text-decoration: none;
font-family: Bitter, Source Sans Open, Helvetica, Arial, Georgia, serif;
}
button:hover,
button:focus,
input[type=”submit”]:hover,
input[type=”button”]:hover,
input[type=”reset”]:hover,
input[type=”submit”]:focus,
input[type=”button”]:focus,
input[type=”reset”]:focus {
background: #313131; /* Old browsers */
background: -webkit-linear-gradient(top, #313131 0%, #313131 100%); /* Chrome 10+, Safari 5.1+ */
background: linear-gradient(to bottom, #313131 0%, #313131 100%); /* W3C */
outline: none;
}
button:active,
input[type=”submit”]:active,
input[type=”button”]:active,
input[type=”reset”]:active {
background: #313131; /* Old browsers */
background: -webkit-linear-gradient(top, #313131 0%, #313131 100%); /* Chrome 10+, Safari 5.1+ */
background: linear-gradient(to bottom, #313131 0%, #313131 100%); /* W3C */
border: none;
border-top: 3px solid #313131;
padding: 10px 24px 11px;
}
—————————————
Þetta mun reyndar breyta Senda inn athugasemd takkanum líka :), ef þú vilt hafa hann ennþá rauðan að þá þarf að bætta við nýjum CSS class á hann og láta hann vera bara með gamla litinn.
Have you tried turning it off an on again?
Til að breyta menu takkanum á mobile.
Í
/* Small menu */
.menu-toggle {
…[stuff]…
}
Bæta þar inn
background: transparent;
Ég myndi láta myndina í topp fylla bara út í boxið sem hún er í, það þarf að laga hana aðeins til en hún resizar þá bara frekar eðlilega.
—————-
//lætur toppbannerinn fylla út í boxið sem hann er í, og vera alltaf miðjuð
.site-header {
background-size: cover;
background-position: 50% 50%;
}
//Hvítt leitaricon í staðinn fyrir þetta gráa sem hverfur í valmyndinni
.site-header input[type=”search”] {
background-image: url(“http://i.imgur.com/Nzr6IW7.png”);
}
//Takkinn ekki lengur rauður.
#site-navigation button.menu-toggle {
background: none;
border-bottom: none;
}
————————
Hérna er þetta in action:
http://codepen.io/olafurns/pen/pjaYOm
{
if
(goals after 10 matches =<10)
return;
Balotelli
}
Var ekki Andri M nr. 5 með þetta? Ef það virkar ekki er oftast kominn tími á að kaupa nýja tölvu!
High five á Arnar samt.
Like
Ég skil ekkert. Vona bara að þið kippið þessu í lag!
TAKK KÆRLEGA allir.
Ég var ekki við tölvu í allan dag, en núna er ég búinn að setja inn þessar breytingar og þetta er miklu betra svona. 🙂