SmartFloat stack

PriceList Stack

Create a responsive price list with ease

The PriceList stack makes it possible to create responsive lists with a description to the left, a price (or other information) to the right and a horizontal line in between, for example for a restaurant menu. The list can be configured extensively (see demo #1).

Demos
Below is a basic demo. A more serious demo (of a restaurant menu) can be found here (demo #2).
With a little creativity, the PriceList stack is also useful for other kinds of lists! See demo #3 for an example.


Usage
To add items to this stack, click the plus button at the bottom. You can’t drag stacks into this stack!
A PriceList Item creates an item with a description to the left, and a price to the right.
To add text items to the list that don't need a price, select the option text only (no price) in that PriceList Item stack.
The exact vertical position of the horizontal line between the description and the price depends on the font and the font size and has to be set manually (under PriceList horizontal line settings).
Whenever possible, use the styling options provided in this stack. Especially adjusting the color and font size in an individual PriceList Item stack will break the layout.

Background

This stack is based on the solution provided by Roko C. Buljan as an answer to this question on stack overflow.

Limitations

Not many really. You’re limited to the use text areas in this stack; and the stack doesn’t look great in Edit mode (for example: the horizontal line is not visible), but that’s about it.
This stack works in all modern browsers, including Internet Explorer 10 and above.

Support
Please use this form to report all issues, questions and comments.

This stack requires the Stacks plugin by YourHead (version 3).
Do you like this stack? Please consider leaving a review in the RapidWeaver Community’s Addons section [link].
PriceList HUD
© 2012-2017 Marathia Web Design | Contact