The Well is a Section that allows multiple controls to be placed inside a styled background.  

Like almost all SPARK controls, you can trigger events that are fired when the user interacts with the control (see the Event and Methods sections below and the Event Handling article for more information).

The Well section is most commonly used to provide a background for other controls.


Color Style:

Color Darkness  None, Dark, or Darker

Icon*  Type in name of Icon from Font Awesome

Icon Size  Size of your Icon. Ex. 200px

Icon Position  Bottom-Right, Bottom-Left, Top-Right, Top-Left 

Vertical Alignment  Default, Top, Middle, Bottom

Padding  Add padding to the well.  Ex. 25px

Border Radius  Add a radius to the well.  Ex. 15px

Width  This sets the width of the well

Height  This sets the height of the well

*There are a variety of icons offered at Font Awesome, allowing you to give visual indication to a user


These are the configuration option settings...

This is the result... (The 'Text' field was added to the Well in this example)


With the Well control, there are 2 types of event handlers:

  • On Load When the page loads
  • On Click When the well is clicked

You can use JavaScript logic to affect the effects of the control, depending on the event. More information on using these controls can be found in the Event Handling article.


For detailed information on the available methods for this control, access the JS Doc file.

Related Article(s)

SPARK Layout Capabilities


  • Author: Dan Abresch
  • Date Created: June 8, 2015
  • Date Modified: July 27, 2015
Was this article helpful?
1 out of 1 found this helpful