Marathia’s Stacks

RapidWeaver stacks for the rest of us

RapidWeaver stacks for the rest of us

Stacks Image 91039

SmartFloat Stack demo #2

a right floating text element


demo #1 | demo #2 | demo #3 | demo #4 | demo #5 | demo #6 | demo #7 | back to the product page

Another example of a floating text element (this time to the right), and another text element wrapping around it. On screens smaller than 768px, the floating text element is shown above the wrapping element, and styled as the wrapping element.

Both the semi-transparent backgrounds and border styling are set within the SmartFloat stack.
On screens wider than 768px, this element ‘floats’, so the text on the right (the wrapping element) wraps around it.

On smaller screens, this element is shown below the wrapping element.
On screens wider than 768px, this element wraps around the element on the left (the floating element).

On smaller screens, this element is shown above the floating element.

Some filler text to make the floating element bigger than the wrapping element: Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet.

Est Investigationes option lectores augue illum. Aliquam autem augue ullamcorper in processus. Quis doming ex legentis videntur adipiscing. Ex dolore laoreet mazim molestie littera. In usus feugiat ii humanitatis vulputate. Luptatum notare ea seacula ii facer. Facer consectetuer qui ut consectetuer ipsum. Ii per accumsan augue possim volutpat. Ut saepius facit quis et augue. Dolor magna nunc dolore ad habent.

Yes, this website uses cookies too. Here’s the annoying but obligatory cookie warning. More info…