Autor Zpráva
Vendy
Profil
Dobrý den a ahoj,
prosím o radu s úpravou CSS.
Někde v rámci zápisu by mělo být, či bych tam měla dopsat, velikost fontu, plus nově přidat i řádkování. Nějak nevím, kam vlézt a s jakým zápisem.
Ukázka zde. To, co v této prosbě o radu řeším, je v ukázce část "Kategorie", která je hned pod kalendářem. Písmo bych tam chtěla nechat, ale určitě větší velikost a rozhodně to dát na řádky. Prosím vás o rady, co s tím, jsem jaksi v pasti. Vím, jsou to naprosté základy, ale CSS nějak nedávám.
V úpravě, kterou mám v nastavení k dispozici, CSS vypadá takto:

.my-calendar-nav ul, .mc-main .category-key ul, .mc-main .mc-export ul, .mc-main .mc-list {
    margin: 0 !important;
    padding: 0 !important;
}

.my-calendar-nav ul li, .mc-main .category-key ul li, .mc-main .mc-export ul li {
    display: inline-block;
    list-style-type: none;
    margin: 0 0 6px;
}

.my-calendar-nav .my-calendar-prev a {
    border-radius: 5px 0 0 5px;
    border-right: 1px solid #bbb;    
}

.my-calendar-nav .my-calendar-next a {
    border-radius: 0 5px 5px 0;
    border-left: 1px solid #fff;    
}

.my-calendar-prev a:before {
    content: '\25C0 ';
}

.my-calendar-next a:after {
    content: ' \25b6';
}

/* Category Key */
.mc-main .category-key h3 {
    margin: 0 0 10px 0 !important;    
}

.mc-main .no-icon {
    display: inline-block;
    width: 1.25em;
    margin-right: .25em;
    border-radius: 12px;
}

.mc-main .category-color-sample img {
    padding: 2px;
    display: inline;
    vertical-align: text-top;
    margin-right: .25em;
}

Předem děkuji za každou radu,
Vendulka
Vendy
Profil
Tak velikost písma i řádkování se mi podařilo vyřešit zápisem
.my-calendar-nav ul, .mc-main .category-key ul, .mc-main .mc-export ul, .mc-main .mc-list {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 1.2em;
    label.wpmlcheckboxlabel.wpml {margin-right: 20px;
}

Tudíž se zeptám jinaK - lze nějak zapsat vytvoření DVOU SLOUPCŮ? Takto pod sebou je toho celkem hodně.
Trejpa
Profil
Vendy:
Tvůj CSS zápis je šatně, nemůžeš zanořovat selektory tříd mezi vlastnosti, to můžeš udělat jen s @media pravidly. Za 4. řádkem chybí závorka }.

lze nějak zapsat vytvoření DVOU SLOUPCŮ?
Z jednoho seznamu? Můžeš z položek udělat in-line bloky a nechat je vedle sebe zařadit (jak to bylo) nebo je nechat plavat vedle sebe s definovanou šířkou položek (polovinu, třetinu nebo čtvrtinu volného místa), takže vytvoří zdání sloupců.

.category-key ul { overflow: auto; width: 100%; }
.category-key ul li { float: left; width: 33%; list-style: none; }
Vendy
Profil
Trejpa:
Tvůj CSS zápis je šatně, nemůžeš zanořovat selektory tříd mezi vlastnosti
Já bych na tewn zápis sama nepřišla, jen jsem si vzpomněla, že jsem již něco podobného řešila a tvrdě (vím, že hloupě) zkopírovala to, s čím jsem se již setkala.

Takže jak by to mělo být správně? Takto je to asi blbost, že?
.my-calendar-nav ul, .mc-main .category-key ul, .mc-main .mc-export ul, .mc-main .mc-list {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 1.2em;
    .category-key ul { overflow: auto; width: 100%; }
    .category-key ul li { float: left; width: 50%; list-style: none; }
 }
Taurus
Profil
Je. Nemůžeš mít {{}}. Vždy jen {} {} vyjma toho, co uvádí Trejpa viz @media.
Trejpa
Profil
Vendy:
selektor { vlastnost: hodnota; }

Uvnitř závorek nemůže být další selektor ani závorky, jen dvojice vlastnost: hodnota;.
Vendy
Profil
Taurus:
Je. Nemůžeš mít {{}}.

Trejpa:
Uvnitř závorek nemůže být další selektor ani závorky, jen dvojice vlastnost: hodnota;.

Aha. Fakt já a CSS nejsme kamarádi. Přepsala jsem to nyní takto:
.my-calendar-nav ul, .mc-main .category-key ul, .mc-main .mc-export ul, .mc-main .mc-list {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 1.2em;
 }
    .category-key ul { overflow: auto; width: 100%; }
    .category-key ul li { float: left; width: 50%; list-style: none; }
a tváří se funkčně, ve dvou sloupcích a ok. Alespoň v prohlížeči záložního PC (Můj normální, na který i vidím, je ko a v opravě).

Je-li tento zápis i z vašeho pohledu správně, pak děkuji za pomoc :)
Trejpa
Profil
Vendy:
Je-li tento zápis […] správně
Ano.

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: