Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > Question about CSS definitions

Reply
Thread Tools

Question about CSS definitions

 
 
rbaulbin@hotmail.com
Guest
Posts: n/a
 
      02-06-2008
Hello -

Is there any advantage to defining classes with the element name vs.
without the element name?

p.center {properties...}
vs.
..center {same properties...}

I mean, if both above can be used for the "p" element, why do people
include the p in the definition?

Thanks,

RB
 
Reply With Quote
 
 
 
 
Beauregard T. Shagnasty
Guest
Posts: n/a
 
      02-06-2008
http://www.velocityreviews.com/forums/(E-Mail Removed) wrote:

> Hello -
>
> Is there any advantage to defining classes with the element name vs.
> without the element name?
>
> p.center {properties...}
> vs.
> .center {same properties...}
>
> I mean, if both above can be used for the "p" element, why do people
> include the p in the definition?


..center can be used with other elements as well, such as:

<div class="center"> ...
<table ...
<ul .. >
etc.

--
-bts
-Motorcycles defy gravity; cars just suck
 
Reply With Quote
 
 
 
 
Jukka K. Korpela
Guest
Posts: n/a
 
      02-06-2008
Scripsit (E-Mail Removed):

> Is there any advantage to defining classes with the element name vs.
> without the element name?


Pardon?

> p.center {properties...}
> vs.
> .center {same properties...}


You meant to ask whether there is an advantage in using an element name
in a selector before a class selector. The answer is that it depends.
And a class name like "center" is almost always a poor choice: it says
nothing about any meaning.

> I mean, if both above can be used for the "p" element, why do people
> include the p in the definition?


Perhaps because a selector like .foo looks so lonely and too similar to
an element name as a selector, just with the tiny ".". It also affects
the denotation of the selector (the set of elements matching it) as well
as its specificy. See an introduction to the first principles of the
basics of the elements of getting started with CSS.

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

 
Reply With Quote
 
Jeff
Guest
Posts: n/a
 
      02-07-2008
Jukka K. Korpela wrote:
> Scripsit (E-Mail Removed):
>
>> Is there any advantage to defining classes with the element name vs.
>> without the element name?

>
> Pardon?
>
>> p.center {properties...}
>> vs.
>> .center {same properties...}

>
> You meant to ask whether there is an advantage in using an element name
> in a selector before a class selector. The answer is that it depends.
> And a class name like "center" is almost always a poor choice: it says
> nothing about any meaning.


OK, I'll bite. I've never heard you condemn a class name before, and to
start with "center" has me a bit amazed. Can you elaborate on why
"center" has no meaning? On the surface it would seem to be self
explanatory.

Jeff
>
>> I mean, if both above can be used for the "p" element, why do people
>> include the p in the definition?

>
> Perhaps because a selector like .foo looks so lonely and too similar to
> an element name as a selector, just with the tiny ".". It also affects
> the denotation of the selector (the set of elements matching it) as well
> as its specificy. See an introduction to the first principles of the
> basics of the elements of getting started with CSS.
>

 
Reply With Quote
 
Michael Fesser
Guest
Posts: n/a
 
      02-07-2008
..oO(Jeff)

>Jukka K. Korpela wrote:
>
>> You meant to ask whether there is an advantage in using an element name
>> in a selector before a class selector. The answer is that it depends.
>> And a class name like "center" is almost always a poor choice: it says
>> nothing about any meaning.

>
>OK, I'll bite. I've never heard you condemn a class name before, and to
>start with "center" has me a bit amazed. Can you elaborate on why
>"center" has no meaning? On the surface it would seem to be self
>explanatory.


A class should reflect the meaning of the content which it is applied
to, not its appearance, e.g. "boldRed" vs. "warning".

But IMHO there are exceptions from this recommendation, I think "center"
is one of them. I even use these five classes in most of my stylesheets:

..ac {text-align: center}
..al {text-align: left}
..ar {text-align: right}
..fl {float: left; margin-right: 1em}
..fr {float: right; margin-left: 1em}

The float classes are mainly used on images, while the alignment classes
are mainly used in table columns. For me these five classes are purely
presentational, they mean nothing else than to align this or that in a
certain way without giving it any special meaning, hence the naming.

But in most other cases my classes are given meaningful names that
describe their intention and usage, not their look.

Micha
 
Reply With Quote
 
dorayme
Guest
Posts: n/a
 
      02-07-2008
In article <(E-Mail Removed)>,
Jeff <jeff@spam_me_not.com> wrote:

> Jukka K. Korpela wrote:
> > Scripsit (E-Mail Removed):
> >
> >> Is there any advantage to defining classes with the element name vs.
> >> without the element name?

> >

....
> > You meant to ask whether there is an advantage in using an element name
> > in a selector before a class selector. The answer is that it depends.
> > And a class name like "center" is almost always a poor choice: it says
> > nothing about any meaning.

>
> ...Can you elaborate on why
> "center" has no meaning? On the surface it would seem to be self
> explanatory.


If you name a class by reference to its function, eg. navigation,
it becomes less confusing when you want to alter its style
properties. But if you name it with a word that usually names a
style, you either buy the confusion when you want to change the
style:

..center {text-align: right;}

or scrap the class and make a new one.

One of the ideas behind the separation of style from content is
to be able to hold the html constant and propose different styles
(for example, for different purposes like types of media). Having
something like .center would make it hard (because confusing) to
do this while holding the html constant.

--
dorayme
 
Reply With Quote
 
Jonathan N. Little
Guest
Posts: n/a
 
      02-07-2008
(E-Mail Removed) wrote:
> Hello -
>
> Is there any advantage to defining classes with the element name vs.
> without the element name?
>
> p.center {properties...}
> vs.
> .center {same properties...}
>
> I mean, if both above can be used for the "p" element, why do people
> include the p in the definition?



In addition to what has been said, adding an element to the class rule
can be useful for element specific properties

..menu { color: white; background-color: black; }
ul.menu { list-style: none; }

the latter rule only apples to ULs of class "menu" where the list
property would be applicable.


--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com
 
Reply With Quote
 
Jeff
Guest
Posts: n/a
 
      02-07-2008
dorayme wrote:
> In article <(E-Mail Removed)>,
> Jeff <jeff@spam_me_not.com> wrote:
>
>> Jukka K. Korpela wrote:
>>> Scripsit (E-Mail Removed):
>>>
>>>> Is there any advantage to defining classes with the element name vs.
>>>> without the element name?

> ...
>>> You meant to ask whether there is an advantage in using an element name
>>> in a selector before a class selector. The answer is that it depends.
>>> And a class name like "center" is almost always a poor choice: it says
>>> nothing about any meaning.

>> ...Can you elaborate on why
>> "center" has no meaning? On the surface it would seem to be self
>> explanatory.

>
> If you name a class by reference to its function, eg. navigation,
> it becomes less confusing when you want to alter its style
> properties. But if you name it with a word that usually names a
> style, you either buy the confusion when you want to change the
> style:
>
> .center {text-align: right;}
>
> or scrap the class and make a new one.
>
> One of the ideas behind the separation of style from content is
> to be able to hold the html constant and propose different styles
> (for example, for different purposes like types of media). Having
> something like .center would make it hard (because confusing) to
> do this while holding the html constant.


OK, I think I see where you guys are going with this and although valid,
it is way different than the way I do it.

To me, it makes more sense to ID the sections of the site, like
#top_nav, #left_side_bar, #main_content and style everything in there as
a descendant. ex: #left_side_bar p{... I use classes for local styling
and even try to avoid them there. So, it wouldn't bother me if .center
or .bold_blue were in any part of the page. I rather think that most
stylesheets have *way* too many classes and I only use a class if it can
be used in more than one place. There's always exceptions of course
and that's where unambiguous names come in, such as .product_thumb.

Now, like most everyone, I work mostly with customers using a CMS. If
they want to center something (not that I think that's a great idea),
I'd rather have them choose a class name that said: center_bold rather
than main_content_alternate_style_1.

Jeff



>

 
Reply With Quote
 
Chaddy2222
Guest
Posts: n/a
 
      02-07-2008
On Feb 7, 3:10*pm, Jeff <jeff@spam_me_not.com> wrote:
> dorayme wrote:
> > In article <(E-Mail Removed)>,
> > *Jeff <jeff@spam_me_not.com> wrote:

>
> >> Jukka K. Korpela wrote:
> >>> Scripsit (E-Mail Removed):

>
> >>>> Is there any advantage to defining classes with the element name vs.
> >>>> without the element name?

> > ...
> >>> You meant to ask whether there is an advantage in using an element name
> >>> in a selector before a class selector. The answer is that it depends.
> >>> And a class name like "center" is almost always a poor choice: it says
> >>> nothing about any meaning.
> >> ...Can you elaborate on why
> >> "center" has no meaning? On the surface it would seem to be self
> >> explanatory.

>
> > If you name a class by reference to its function, eg. navigation,
> > it becomes less confusing when you want to alter its style
> > properties. But if you name it with a word that usually names a
> > style, you either buy the confusion when you want to change the
> > style:

>
> > .center {text-align: right;}

>
> > or scrap the class and make a new one.

>
> > One of the ideas behind the separation of style from content is
> > to be able to hold the html constant and propose different styles
> > (for example, for different purposes like types of media). Having
> > something like .center would make it hard (because confusing) to
> > do this while holding the html constant.

>
> OK, I think I see where you guys are going with this and although valid,
> it is way different than the way I do it.
>
> * *To me, it makes more sense to ID the sections of the site, like
> #top_nav, #left_side_bar, #main_content and style everything in there as
> a descendant. ex: #left_side_bar p{... I use classes for local styling
> and even try to avoid them there. So, it wouldn't bother me if .center
> or .bold_blue were in any part of the page. I rather think that most
> stylesheets have *way* too many classes and I only use a class if it can
> be used in more than one place. *There's always exceptions of *course
> and that's where unambiguous names come in, such as .product_thumb.
>
> * Now, like most everyone, I work mostly with customers using a CMS. If
> they want to center something (not that I think that's a great idea),
> I'd rather have them choose a class name that said: center_bold rather
> than main_content_alternate_style_1.
>
> * *Jeff
>
>

I think your nameing system is fine.
I agree with you on the class issue but I would also say that useing
classes is better then useing inline styles.
--
Regards Chad. http://freewebdesignonline.org
 
Reply With Quote
 
John Hosking
Guest
Posts: n/a
 
      02-07-2008
Michael Fesser wrote:
>
> A class should reflect the meaning of the content which it is applied
> to, not its appearance, e.g. "boldRed" vs. "warning".


Agreed, at least the first part, although it seems you have swapped the
examples.

>
> But IMHO there are exceptions from this recommendation, I think "center"
> is one of them. I even use these five classes in most of my stylesheets:
>
> .ac {text-align: center}
> .al {text-align: left}
> .ar {text-align: right}
> .fl {float: left; margin-right: 1em}
> .fr {float: right; margin-left: 1em}


So what do you do when you decide the image which has been floated right
should now be on the left?

>
> The float classes are mainly used on images, while the alignment classes
> are mainly used in table columns.


Wondering (and excited to hear) how you style the columns.

> For me these five classes are purely
> presentational, they mean nothing else than to align this or that in a
> certain way without giving it any special meaning, hence the naming.


Exactly: they're purely presentational. But you've built their
presentation into the code by including the (abbreviated and obscure)
class names in the HTML.


--
John
Read about the UIP: http://improve-usenet.org/
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Re: correction: A question about css (was: A question about css) richard HTML 12 03-09-2010 08:52 PM
Committed Access Rate definitions question Bartosz Piec Cisco 2 10-10-2005 07:37 AM
Question about definitions Thomas Barth C++ 3 11-15-2004 04:11 PM
A question on incomplete definitions ark C Programming 24 12-22-2003 10:59 PM
Silly question - automating *manual* anti-virus definitions update process Computer Support 3 09-01-2003 06:50 PM



Advertisments