W3C home > Mailing lists > Public > www-style@w3.org > October 2010

Re: css block re-use proposal

From: Jonas Hartmann <j0n4s.h4rtm4nn@googlemail.com>
Date: Thu, 28 Oct 2010 16:32:20 +0200
Cc: "Eric Twilegar" <Eric.Twilegar@onpeak.com>, "www-style@w3.org" <www-style@w3.org>
Message-Id: <A3691748-1986-4252-9FBE-C50440B7F867@googlemail.com>
To: GreLI <greli@mail.ru>
Hello GreLi,

the difference is that you have to add presentational attributes to your markup/structural document.
Reducing the amount of unnecessary classes (and divs) in markup is a goal of mine if I want to do lightweight + semantic html structures.

Regards
 Jonas

On 2010-10-28, at 16:21, GreLI wrote:

> You can already do code reuse by at least two ways now:
> 
> 1. You can group selectors with comma:
> .someRealClassOnADiv,
> .someAnotherRealClassOnADiv {
>      border-style:solid;
>      border-width:1px 1px 0;
> }
> 
> 2. You can make class with general attributes and enhance it with additional classes:
> .someGenericClass,
> {
>      border-style:solid;
>      border-width:1px 1px 0;
> }
> .specificAdditionalClass {
>      border-color:green;
> }
> .anotherSpecificAdditionalClass {
>      border-color:blue;
> }
> 
> <div class="someGenericClass specificAdditionalClass"></div>
> <div class="someGenericClass anotherSpecificAdditionalClass"></div>
> 
> 
> On Tue, 26 Oct 2010 02:20:20 +0400, Eric Twilegar <Eric.Twilegar@onpeak.com> wrote:
> 
>> Many times in CSS I find myself copying and pasting the exact block of CSS statements from block to block.
>> 
>> It would be nice if in CSS you could reference one block of CSS inside of another block.
>> 
>> I would suggest that we could create a block with a name perhaps using the $ character to start it. Then refer to it in another block like an include so that the CSS lines are copied in.
>> 
>> 
>> $bottomLessBorderStyleGroup
>> {
>>      border-style:solid;
>> 
>>      border-top-width:1px;
>>      border-left-width:1px;
>>      border-right-width:1px;
>>      border-bottom-width:0px;
>> }
>> 
>> ..someRealClassOnADiv
>> {
>> $bottomLessBorderStyleGroup
>> }
>> 
>> 
>> For now I'm implementing something similar by generating the CSS server side, but it would be nice to not have to go to a pre-processor.
>> 
>> 
>> et
> 
Received on Thursday, 28 October 2010 14:33:03 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:33 GMT