Open In App

Foundation CSS General Complete Reference

Improve
Improve
Like Article
Like
Save
Share
Report

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:

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=
         crossorigin="anonymous">
      <script src=
              crossorigin="anonymous">
      </script>
      <title>Label Positioning</title>
   </head>
   <body>
      <center>
          <div>
             <div class="float-center">
                <h2 style="color:green">GeeksforGeeks</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:

 



Last Updated : 11 Jul, 2022
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads