www.webdeveloper.com
Results 1 to 2 of 2

Thread: providing space between fields within single div tag

  1. #1
    Join Date
    Dec 2013
    Posts
    13

    providing space between fields within single div tag

    this is my code: html

    Code:
     
    <div class="fieldDate">
    <label for="statusEmp">Status of Employee:</label>
                        <select  name="statusEmp" id="statusEmp">
                            <option value="0">Active</option>
                            <option value="1">Inactive</option>
                        </select>
    
                        
                        <label  for="fromDate">From:</label>
                        <input type="date" name="fromdate" id="fromDate">
    
                        <label for="toDate">To:</label>
                        <input  type="date" name="todate" id="toDate">
    
                        <label for="search">Search:</label>
                        <input  type="search" name="search" id="search">
                        <input type="submit">
                        </div>
    css :
    
    .fieldDate {
    
            float: right;
            margin-right: 200px;
        }
    
        margin-right: 200px;
        }
    i want to have space between the three fields: status, from/to,search how do i do it?

    they all appear in the same line( which is what i want) without space in between the fields.
    Last edited by rajshekar90; 01-15-2014 at 12:47 AM.

  2. #2
    Join Date
    Jan 2004
    Location
    chertsey, a small town s.w. of london, england.
    Posts
    1,459
    Hi there rajshekar90,

    try it like this...
    Code:
    
    <!DOCTYPE html>
    <html lang="en">
    <head>
    
    <meta charset="utf-8">
    
    <title>untitled document</title>
    
    
    <style>.fieldDate {
        float:right;
        margin-right:200px;
        }
    select,input {
        margin:0 10px;
        }
    </style>
    
    </head>
    <body>
    
    <form class="fieldDate" action="#">
    <label for="statusEmp">Status of Employee:</label>
    <select name="statusEmp" id="statusEmp">
     <option value="0">Active</option>
     <option value="1">Inactive</option>
    </select>
    <label for="fromDate">From:</label>
    <input type="text" name="fromdate" id="fromDate">
    <label for="toDate">To:</label>
    <input type="text" name="todate" id="toDate">
    <label for="search">Search:</label>
    <input type="text" name="search" id="search">
    <input type="submit">
    </form>
    
    </body>
    </html>
    coothead

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles