Stadium
  • Home
  • Academy
  • How it works
    • Designer
    • Application Manager
    • Application users and roles
    • Designing applications
    • User API
  • Features
    • Application
    • Create a Form
    • Embedded Files
    • Events
    • Expression Editor
    • Pages
    • Preview
    • Publish
    • Scripts and Event Handlers
    • Session Variables
    • Settings
    • Styles
    • StyleSheet
    • Templates
    • Types
    • Validations Cheat Sheet
  • Connectors
    • Database Connector
    • File System Connector
    • Web Service Connector
  • Controls
    • Button
    • Chart
    • Checkbox
    • Checkbox List
    • Container
    • Data Grid
    • Date Picker
    • Drop Down
    • Flexbox
    • Grid
    • Image
    • Label
    • Link
    • Menu
    • Panel
    • Radio Button List
    • Repeater
    • Table
    • Text Box
    • Upload File
  • Actions
    • Async
    • Call Web Service
    • Decision (If/Else)
    • Display Message Box
    • Download File
    • For Each
    • Java Script
    • Navigate To Page
    • Notification
    • Set Value
    • Variable
    • While
  • Release Notes
    • 6.12.3272
    • 6.12.3270
    • 6.12.3268
    • 6.12.3264
    • 6.11.3223
    • 6.11.3221
    • 6.11.3220
    • 6.11.3218
    • 6.11.3210
    • 6.10.3155
    • 6.10.3151
    • 6.9.3102
    • 6.8.3100
    • 6.7.3096
    • 6.6.3082
    • 6.6.3081
    • 6.6.3080
    • 6.6.3075
    • 6.5.3055
    • 6.4.3036
    • 6.4.3034
    • 6.4.3033
    • 6.3.3019
    • 6.2.2999
    • 6.2.3001
    • 6.1.2990
    • 6.0.2972
    • 6.0.2970
    • 6.0.2969
Powered by GitBook
On this page

Was this helpful?

  1. Controls

CSS for Flexbox

Last updated 8 months ago

Was this helpful?

The Flexbox control and any other controls added to it as part of your design can be styled with CSS.

Below are a few examples of useful CSS code snippets that you can use in your application.

CSS code snippets

Cards

Cards can be created by styling a <div> tag with CSS. In Stadium that means styling a Container control. Below is one example of a basic card that contains an image and a label.

The following code snippet is for a Container control (<div> tag), placed inside a Flexbox to create the card display:

box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2); transition: 0.3s; width: 250px; text-align: center; padding-left: 20px; padding-right: 5px; margin-right: 15px;