Entry Post

Entry Module
Entry
Main Post Title

3 Layers of an Active Element

Post Header Aside
Comments Actions Snippet
Comments Population
Comment Creation

Post Content

Imagine this ombre cake:

Ombre Cake
Photo by sackerman519 on Flickr.

It looks yummy and it has layers.

It is similar with active elements – they must have three levels for the purpose of CSS.

The first level is the textual element itself. The second level holds the function of the active element (e.g., <a> or <button>). The third level is for positioning. Initially, it appears that the default way to put it is this way:

<a>Label</a>

And since this is for the purpose of CSS, we must impement Framing for the textual element and for positioning. These frames will act as hooks for CSS. Look at this example:

 <div> <!-- Frame for positioning --> <a> <span> <!-- Frame for textual element --> Label </span> </a>
</div> 

Here’s a demo to show a floated button:

See the Pen 3 Layers of an Active Element Article Entry Admin Actions by Brian Dys Sahagun (@BrianSahagun) on CodePen.1820

Oh and by the way, here’s an ombre potato:

Ombre Potato
Source: Ombre Potato and Cheese Torte on Green Gourmet Giraffe
Comment Module
Comments
Comments
Comments Actions Snippet
Comments Population
Comment Creation

There are no comments.

Comment Creation
Compose Comment