Foundation CSS General Complete Reference
Foundation CSS is an open-source and responsive front-end framework created by ZURB in September 2011 that makes it simple to create stunning responsive websites, apps, and emails that operate on any device. Foundation CSS General use to manage general things like form label Positioning, and upload button and this class has many features for XY grid-like grid container, XY vertical/horizontal grid, XY Grid Auto Sizing, etc.
Complete list of Foundation CSS General are listed below:
- Foundation CSS XY Grid
- Foundation CSS XY Grid Importing
- Foundation CSS XY Grid Gutters
- Foundation CSS XY Grid Container
- Foundation CSS XY Grid Auto Sizing
- Foundation CSS XY Grid Responsive Adjustments
- Foundation CSS XY Grid Collapse Cells
- Foundation CSS XY Grid Offsets
- Foundation CSS XY Block Grids
- Foundation CSS XY Vertical Grids
- Foundation CSS XY Grid Frame
- Foundation CSS XY Grid Build Semantically
- Foundation CSS XY Grid Sass Reference
- Foundation CSS Float Grid
- Foundation CSS Float Grid Importing
- Foundation CSS Float Grid Advanced
- Foundation CSS Float Grid Build Semantically
- Foundation CSS Float Grid Sass Reference
- Foundation CSS Flex Grid
- Foundation CSS Flex Grid Importing
- Foundation CSS Flex Grid Advanced Sizing
- Foundation CSS Flex Grid Responsive Adjustments
- Foundation CSS Flex Grid Column Alignment
- Foundation CSS Flex Grid Collapse/Uncollapse Rows
- Foundation CSS Flex Grid Offsets
- Foundation CSS Flex Grid Block
- Foundation CSS Flex Sass Reference
- Foundation CSS Forms
Example:
HTML
<!DOCTYPE html> < html lang = "en" > < head > < meta charset = "UTF-8" > < meta name = "viewport" content=" width = device -width, initial-scale = 1 .0"> < link rel = "stylesheet" href = "https://cdn.jsdelivr.net/npm/foundation-sites@6.7.4/dist/css/foundation.min.css" crossorigin = "anonymous" > < script src = "https://cdn.jsdelivr.net/npm/foundation-sites@6.7.4/dist/js/foundation.min.js" crossorigin = "anonymous" > </ script > < title >Label Positioning</ title > </ head > < body > < center > < div > < div class = "float-center" > < h2 style = "color:green" >w3wiki</ h2 > < h4 > Foundation CSS Form </ h4 > </ div > < form > < div class = "grid-x" style="width: 40%; margin-top: px;"> < div class = "small-2 cell" > < label for = "input-label" class = "text-left" >Age: </ label > </ div > < div class = "small-6 cell" > < input type = "number" id = "input-label" placeholder = "Enter your Age" > </ div > < div class = "small-9 cell" > < label for = "upload" class = "button" > Upload Your File </ label > < input type = "file" id = "upload" class = "show-for-sr" > </ div > </ div > </ center > </ form > </ div > </ body > </ html > |
Output:
Contact Us