CSS float right.....

Question

0.00/5 (No votes)

See more:

I'm trying to float a button element to the right and it isn't working as I would expect.

This is without "float:right;"

http://i.imgur.com/wSQxs.png[^]

And then it goes down to the next line when I add "float:right;".

http://i.imgur.com/QfEl2.png[^]

How would I make the button dock on the very right side of the gray box?

Posted 24-May-12 18:35pm

ZaiDz

Add a Solution

2 solutions

Solution 1

This works as expected when I run the sample page:

XML

<asp:Panel runat="server" ID="textPanel" BorderColor="Black" BorderWidth="2">
 <label>Dock float</label>
 <input style="float: right;" type="button" value="PressMe" />
</asp:Panel>

Though, I did find VS designer showing it on the next line as your image, but things were as per expectation when I run the app. Try out.

Posted 24-May-12 18:49pm

Sandeep Mewara

Comments

ZaiDz 25-May-12 0:55am

Same thing happened.

http://i.imgur.com/tebgd.png

Sandeep Mewara 25-May-12 3:52am

Not here. I see it all good.

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

hitech_s · Accepted Answer · 2012-05-24T21:13:00

Solution 2

you can use this

XML

<div style="width: 50%;">
                    <div style="float: none;">
                        your text comes here
                    </div>
                    <div style="float: left;">
                        <input type="text" id="txtid" />
                    </div>
                    <div style="float: right;">
                        <input type="button" value="okay" />
                    </div>
                </div>

Posted 24-May-12 21:13pm

hitech_s

Comments

ZaiDz 25-May-12 22:15pm

Thank you.

hitech_s 26-May-12 0:06am

it's ok ZaiDz.

member60 26-May-12 0:54am

My 5!

hitech_s 26-May-12 1:00am

thanks member60