[CSS] Shorthand voor 4 border kleuren mogelijk?*

[Verwijderd]

Ik heb verschillende manieren geprobeerd, maar het lijkt wel of je geen shorthand kunt gebruiken als je vier zijden een andere borderkleur geeft:

Cascading Stylesheet:

.brd .main-content .main-item .icon {
  border-color: #EDF1F5 #DDE0E4 #C6CBD3 #BABFC6;
  border-style: solid;
  border-width: 0.5833em;
  float: left;
}

/* is blijkbaar niet hetzelfde als: */

.brd .main-content .main-item .icon {
  border: 0.5833em solid #EDF1F5 #DDE0E4 #C6CBD3 #BABFC6;
}

Doe ik iets verkeerd of kan dit gewoon niet korter?

[HaTe]

Je moet het scheiden met een komma teken

Cascading Stylesheet:

.brd, .main-content, .main-item, .icon {
  border-color: #EDF1F5 #DDE0E4 #C6CBD3 #BABFC6;
  border-style: solid;
  border-width: 0.5833em;
  float: left;
}

/* is blijkbaar niet hetzelfde als: */

.brd, .main-content, .main-item, .icon {
  border: 0.5833em solid #EDF1F5 #DDE0E4 #C6CBD3 #BABFC6;
}

//edit

Ooh dat bedoel je niet

[ Voor 83% gewijzigd door HaTe op 03-12-2008 22:01 ]

[BtM909]

Het zou dan eerder border zijn ipv border-color, maar border reageert maar op 1 kleur

Cascading Stylesheet:

.brd .main-content .main-item .icon {
  border: 0.5833em solid;
  border-color: #EDF1F5 #DDE0E4 #C6CBD3 #BABFC6;
}

Dit zou weer wel moeten werken

[ Voor 3% gewijzigd door BtM909 op 03-12-2008 22:02 ]

[Verwijderd]

BtM909 schreef op woensdag 03 december 2008 @ 22:01:
Het zou dan eerder border zijn ipv border-color, maar border reageert maar op 1 kleur

Cascading Stylesheet:

.brd .main-content .main-item .icon {
  border: 0.5833em solid;
  border-color: #EDF1F5 #DDE0E4 #C6CBD3 #BABFC6;
}

Dit zou weer wel moeten werken

Thanks! Dat werkt idd

[Verwijderd]

Waarom wil je iets per se in de shorthand notatie? Ik gebruik die notatie liever niet omdat het bij overerving veel lastiger is om uit te zoeken waar iets vandaan komt.

[BtM909]

^ ^ wilde ik net toevoegen

[DiSiLLUSiON]

Zou je mij een voorbeeld kunnen geven op welke manier het gebruiken van shorthand notaties lastiger is mbt. overerving? Zelf ondervind ik er totaal geen problemen mee, integendeel, de CSS wordt netter en duidelijker en voor Firebug maakt het ook niets uit.

[Verwijderd]

Het zoekt toch minder snel, het scannen van een CSS bestand met je ogen gaat minder vlot, en je kunt er niets méér mee dan met de "lange" notatie. Dat netter en duidelijker is een bullshit-argument. Ik weet na de alle CSS bestanden die ik heb geproduceerd echt wel wat duidelijk is en wat niet.

Dat de topicstarter hier alweer een probleem mee heeft toont maar weer aan dat het alleen maar gezeik kan opleveren.

[DeZzL]

DiSiLLUSiON schreef op donderdag 04 december 2008 @ 09:31:
Zou je mij een voorbeeld kunnen geven op welke manier het gebruiken van shorthand notaties lastiger is mbt. overerving? Zelf ondervind ik er totaal geen problemen mee, integendeel, de CSS wordt netter en duidelijker en voor Firebug maakt het ook niets uit.

stel dat je ergens een paragraaf hebt en als volgt opmaakt:

Cascading Stylesheet:

p {background: #fff url(file.png) no-repeat top left;

en je wilt later bij een uitzondering alléén de achtergrond afbeelding aanpassen op deze manier:

Cascading Stylesheet:

p.class{background-image: url (file2.png);}

Dan krijg je wat probleempjes met de andere eigenschappen die je eerder al in shorthand hebt opgegeven.

[ Voor 32% gewijzigd door DeZzL op 04-12-2008 19:15 ]

[_Thanatos_]

Onthoudt gewoon de gouden shorthand-regels:

1. Een shorthand is altijd minder specifiek dan een expliciete property, tenzij de shorthand in een andere, specifiekere selector wordt gebruikt.
2. Een shorthand waarvan niet alle properties gedefinieerd zijn, krijgen die properties de default value, en niet de cascaded value. Dat maakt het gelijk onverstandig om !important erbij te halen.
3. Een shorthand waarbij een aantal van hetzelfde soort properties achter elkaar moeten, krijgen de niet gedefinieerde properties de waarde van hun "tegenoverliggende" property. Dus als je top-right-bottom definieert, laat je left weg, en krijgt ie dus de waarde van right.

Mis ik iets?