One element with multiple classes assigned to it?

[VShaneCurtis]

Hi Guys.

Quick question is it possible for a page element to have multiple classes assigned to it? My page has a left and right sidebar.  Both currently have a class assigned to them called bodyStyle.  It handles the border and color aspects of the body area of the page.  I want to create a class that is specific for both sidebars that adds additional things that would be used by both sidebars but not the main content area..  I could use the IDs but that would create repetition.  A class is the better cloice but I am unsure about having multiple classes.

[Nancy OShea]

Yes.  Elements can and often do have multiple classes.  Bootstrap is a good example or where many classes are combined to create desired styles. 

But owing to cascade importance, HTML tags take first priority, IDs second, classes third.

[Nancy OShea]

What's wrong with using this?

aside {border: 1px solid;  background:silver;}

<aside>

Left sidebar

</aside>

<main>

Main content

</main>

<aside>

Right Sidebar

</aside>

[osgood_]

What's wrong with using this?

aside {border: 1px solid;  background:silver;}

<aside>

Left sidebar

</aside>

<main>

Main content

</main>

<aside>

Right Sidebar

</aside>

By @Nancy OShea

Apparently thats not the correct use of the 'aside' element, its open to debate.........hummm. I'm not going there, everyone seems to have their own ideas.

[Nancy OShea]

My point being, style the tag; not more classes. 

Unless one intends to use the same classes elswhere, there's little need for them.

I use classes for things like text styles.

.center {text-align:center}

.right {text-align:right}

[VShaneCurtis]

In my case the answer is yes.  It would be used on both sidebars so a class makes sense to me.  I don't know if I've ever seen it coded before which was the reason for my question not to start an all out debate again.  Is the proper notation class="class1 class2"?

[Nancy OShea]

If only used on sidebars, it would be more productive to style the tags.

Classes are for things you may use 10-20 times.  Think "economy of code."  Otherwise you'll hate yourself later for overcomplicating the  code.

Yes, that's correct syntax.

<div class="class1 class2 class3 class4...">  </div>

[VShaneCurtis]

Thank you for the clarification.  I appreciate the help.  I realize that I will have some "house cleaning" to do.  Right now I'm just testing things out.  I'll look for ways to consolidate things if it works.  Sometimes you have to make a little mess to figure stuff out.

[osgood_]

I don't know if I've ever seen it coded before 

By @VShaneCurtis

Seriously? I guarantee that more websites are built this way than not, just take a look at their source code. These websites are generally using some kind of hideous css framework.

My take on this is you should try to limit the number of classes you add to your html which will produce considerably less html code bloat and be easier to manage.

Influencers, from those large social media companies are making the process of web development more complex and harder than it really is for those that have no real reason or requirement to resort to using such workflows.