homepage Welcome to WebmasterWorld Guest from 54.204.90.135
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

    
Text area won't display at top right corner of page
problem with css
slam38




msg:3944000
 11:52 am on Jul 1, 2009 (gmt 0)

I am trying to design an image order form.

I would like my layout to be; name, email, phone number displayed top left. One text field under the other. (no problem with this).

Delivery address text area displayed top right. (here is where I am having trouble, it sits at the bottom right of the form).

image order, quantity and size to sit in a row (spanning the width of the page) at the bottom.

Could someone help please?

Here is my code:

<div class="delivery">
<p>
<label for="address">Delivery address:</label>
<textarea name="address" id="address" cols"45" rows="5"></textarea>
</p>
</div>

.delivery {
width:420px;
padding:5px;
margin-top:0px;
}

The margin-top property is not doing anything I have messed about with the float and margin properties but it won't shift from the bottom of the page.

 

stivare




msg:3944200
 5:21 pm on Jul 1, 2009 (gmt 0)

Hi Slam,

Try property {float : right}. That should do the trick.

Cheers

slam38




msg:3944246
 6:06 pm on Jul 1, 2009 (gmt 0)

Hi Stivare,

thanks for getting back to me, I've just done what you suggested but it hasn't worked. For some reason it won't sit at the top of the page.

rocknbil




msg:3944335
 8:25 pm on Jul 1, 2009 (gmt 0)

Welcome aboard slam 38,

Delivery address text area displayed top right. (here is where I am having trouble, it sits at the bottom right of the form).

In order for the floated element to float, it has to have something to float around - put the delivery element first in the code source. Additionally, only element on the page using this selector? Make it an ID (not the problem, but is appropriate.) Also a wrapping div is probably not necessary, use the <p> you have there.

#delivery {
float: right;
width:420px;
padding:5px;
margin-top:0px;
}

...........

<p id="delivery">
<label for="address">Delivery address:</label>
<textarea name="address" id="address" cols"45" rows="5"></textarea>
</p>

<div id="company-info">
Name, address, etc, I will naturally be at the LEFT if a selector doesn't tell me to do otherwise.
</div>

slam38




msg:3947227
 9:43 pm on Jul 6, 2009 (gmt 0)

Hi rocknbil

thankyou for the detailed reply, sorry for the late reply haven't been on the forum for a few days.

I'm going to try out what you have suggested.

thanks again.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved