JavaScript and client side scripting.
Moderator: General Moderators
shiznatix
DevNet Master
Posts: 2745 Joined: Tue Dec 28, 2004 5:57 pm
Location: Tallinn, Estonia
Contact:
Post
by shiznatix » Mon Dec 11, 2006 10:28 am
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.
Obadiah
Forum Regular
Posts: 580 Joined: Mon Jul 31, 2006 9:13 am
Location: Ashland, KY
Contact:
Post
by Obadiah » Mon Dec 11, 2006 10:35 am
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>
neel_basu
Forum Contributor
Posts: 454 Joined: Wed Dec 06, 2006 9:33 am
Location: Picnic Garden, Kolkata, India
Post
by neel_basu » Mon Dec 11, 2006 12:14 pm
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
neel_basu
Forum Contributor
Posts: 454 Joined: Wed Dec 06, 2006 9:33 am
Location: Picnic Garden, Kolkata, India
Post
by neel_basu » Mon Dec 11, 2006 12:17 pm
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>
matthijs
DevNet Master
Posts: 3360 Joined: Thu Oct 06, 2005 3:57 pm
Post
by matthijs » Mon Dec 11, 2006 12:25 pm
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.