Have questions about positioning an element inside a div

[Guest basudz]

I am building an ASP.Net site and I have two floating divs across the top that make up my banner. In the right div I want to position a login control in the top right corner. When I add the control it is located in the top left corner of the div.

 

I've been able to move it to the right corner by two ways...using absolute positioning and setting the left margin to about 200px...

Or wrapping the login control in a span element and floating right the whole span block.

 

My questions are:

 

How come I can float right the span element and it works, but if I wrap the login control in a paragraph element, it doesn't move by floating it right?

 

I also tried converting the login control into a table, and positioning the table by floating, which didn't work either..

 

I know I'm misunderstanding something here so I'm hoping to get some clarification.. I was under the impression that floating is for block level elements? Which I thought at least a paragraph element was block level? Even still I tried setting it as block level anyway lol

 

oh btw, the containing div only has a background image set, no repeat, height & width (the login control is smaller then the containing div), and a float property.

I also tried text alignment right thinking maybe at least the paragraph element would be right justified...but no such luck..

 

I am only working with IE 8 and FF 3.5.2 which is all I'm conerned about right now..

I think that covers all the detail...any help or explanation would be very appreciated..I'm pretty new to CSS and want to get a better understanding of positioning.

[falkencreative]

As far as I know, it should be possible to float

and

elements. Can you post code/a link showing one of the issues? It'll be easier to tell what is going on.

[lm]

basically there is no need to use extra tags to style (or position in this case) login as you can style your form ( login) applying css to it ( see some examples).

So just create class or id for the login form and use float: right to float input box to the right, for example:

#loginright {

position:relative;

float: right;

}

Don't forget to clear floats using clearing div after floating element.

[soumali]

Hello everyone,

 

in CSS can anyone tell me exactly the difference between class and div tags.please site examples

 

 

 

 

[Link Deleted]

Edited September 15, 2009 by Andrea

[virtual]

I think your question is what is the difference in div tags between id's and classes?

 

ID is used only once on the page for important elements such as header, content, footer of which there will only be one.

Classes are used for other elements which will be repeated on the page.