Page 1 of 1
Align left and right
Posted: Mon Dec 11, 2006 10:28 am
by shiznatix
I am trying to have on the same line a submit button aligned to the left and then one to the right. It is not working right now as the only way I can think to do it just centers all of them. Heres my code:
Code: Select all
<div style="text-align: left; display: inline;">
<input type="submit" value="'MORE" onClick="addRowToTable();" class="submit-button" />
<input type="submit" value="LESS" onClick="removeRowFromTable();" class="submit-button" />
</div>
<div style="text-align: right; display: inline;">
<input type="submit" name="Action[Add]" value="UPLOAD" class="submit-button" />
</div>
like I said, that just centers them all.
Posted: Mon Dec 11, 2006 10:35 am
by Obadiah
try this
Code: Select all
<div style="float: left; display: inline;">
<input type="submit" value="'MORE" onClick="addRowToTable();"
class="submit-button" />
<input type="submit" value="LESS" onClick="removeRowFromTable();"
class="submit-button" />
</div>
<div style="float: right; display: inline;">
<input type="submit" name="Action[Add]" value="UPLOAD"
class="submit-button" />
</div>
Posted: Mon Dec 11, 2006 10:46 am
by CoderGoblin
Posted: Mon Dec 11, 2006 12:14 pm
by neel_basu
Here Is The Code
=============
Code: Select all
<div style="position: absolute; width: 29px; height: 10px; z-index: 1; left: 644px; top: 24px" id="upload">
<input type="submit" name="Action[Add]" value="UPLOAD" class="submit-button" /></div>
<div style="position: absolute; width: 2px; height: 14px; z-index: 1; left: 268px; top: 30px" id="less">
<input type="submit" value="LESS" onClick="removeRowFromTable();" class="submit-button" /></div>
<div style="position: absolute; width: 10px; height: 7px; z-index: 1; left: 39px; top: 28px" id="more">
<input type="submit" value="'MORE" onClick="addRowToTable();" class="submit-button" /></div>
You Can Align Them Separately With 100% Freedom.
Just Change The
left:
top:
Properties According To Your Need
Posted: Mon Dec 11, 2006 12:17 pm
by neel_basu
As For Positioning Purpouse css Is Not Nedded You Can Remove The class Attribute
Code: Select all
<div style="position: absolute; width: 29px; height: 10px; z-index: 1; left: 644px; top: 24px" id="upload">
<input type="submit" name="Action[Add]" value="UPLOAD" /></div>
<div style="position: absolute; width: 2px; height: 14px; z-index: 1; left: 268px; top: 30px" id="less">
<input type="submit" value="LESS" onClick="removeRowFromTable();" /></div>
<div style="position: absolute; width: 10px; height: 7px; z-index: 1; left: 39px; top: 28px" id="more">
<input type="submit" value="'MORE" onClick="addRowToTable();" /></div>
Posted: Mon Dec 11, 2006 12:25 pm
by matthijs
In my opinion the solution on communitymx is a bit cleaner, not having to specify widths and heights on everything. If you specify those you loose the flexibility of being able to scale the (text)size.