html - border-spacing for fieldset elements -
this question has answer here:
i'm trying "pad" elements of fieldset , suggested used border spacing. looking @ w3 schools, appears border spacing table elements, i'm not sure else do. here css , html. using border-spacing made no changes display of page.
fieldset { display: block; /*margin: 0 auto;*/ /*text-align: center;*/ /*margin-left: 2px;*/ /*margin-right: 2px;*/ padding-top: 0.35em; padding-bottom: 0.625em; padding-left: 0.75em; padding-right: 0.75em; border: 2px groove; } .table { display: table; /*text-align: center;*/ /*margin: 0 auto;*/ } .tr { display: table-row; /*padding-top: 0.35em;*/ /*padding-bottom: 0.625em;*/ vertical-align: top; border-spacing: 10px 50px; } .td { display: table-cell; text-align: left; vertical-align: top; /*border-spacing: 10px 50px;*/ } .td.right { text-align: right; } <fieldset> <div class="tr"> <div class="td right">date of call:</div> <div class="td"><input class="datepicker2" name="calldate"></div> <div class="td right">caller code number:</div> <div class="td"><input class="codemaker" name="callercodenum"></div> <div class="td right">is there warrant? if jurisdiction?</div> <div class="td"><input type="text" name="jurisdiction"></div> </div> </fieldset>
you can use padding
on fieldset
:
fieldset { display: block; border: 2px groove; padding: 50px 20px; } .table { display: table; /*text-align: center;*/ /*margin: 0 auto;*/ } .tr { display: table-row; /*padding-top: 0.35em;*/ /*padding-bottom: 0.625em;*/ vertical-align: top; border-spacing: 10px 50px; } .td { display: table-cell; text-align: left; vertical-align: top; /*border-spacing: 10px 50px;*/ } .td.right { text-align: right; }
<fieldset> <div class="tr"> <div class="td right">date of call:</div> <div class="td"><input class="datepicker2" name="calldate"></div> <div class="td right">caller code number:</div> <div class="td"><input class="codemaker" name="callercodenum"></div> <div class="td right">is there warrant? if jurisdiction?</div> <div class="td"><input type="text" name="jurisdiction"></div> </div> </fieldset>
or mean distance between fields? use padding on td
s:
fieldset { display: block; border: 2px groove; padding: 10px; } .table { display: table; /*text-align: center;*/ /*margin: 0 auto;*/ } .tr { display: table-row; /*padding-top: 0.35em;*/ /*padding-bottom: 0.625em;*/ vertical-align: top; border-spacing: 10px 50px; } .td { display: table-cell; text-align: left; vertical-align: top; /*border-spacing: 10px 50px;*/ padding: 20px; } .td.right { text-align: right; }
<fieldset> <div class="tr"> <div class="td right">date of call:</div> <div class="td"><input class="datepicker2" name="calldate"></div> <div class="td right">caller code number:</div> <div class="td"><input class="codemaker" name="callercodenum"></div> <div class="td right">is there warrant? if jurisdiction?</div> <div class="td"><input type="text" name="jurisdiction"></div> </div> </fieldset>
Comments
Post a Comment