Containers

Yaff introduces several types of containers, prividing responsive front-end.

Segment

Segments are used to separate and center horizontally content of the website.

Class

yaff segment

Example

<div class="yaff segment">
    <div>Separated content</div>
</div>

Article

Articles are formatted, responsive containers. The following table presents article sizes with different screen width.

< 828px	> 1084px	> 1340px
90% of the screen's width	768px	1024px

Class

yaff article

Example

<div class="yaff article">
    <div>Content</div>
</div>

Simple article

Simple articles behave like normal articles, but are not visually distinctive.

Class:

yaff simple-article

Example:

<div class="yaff simple-article">
    <div>Content</div>
</div>