Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > CSS forms Help!

Reply
Thread Tools

CSS forms Help!

 
 
mark | r
Guest
Posts: n/a
 
      04-13-2005
Using the code below and XHTML how do i get the P tags to contain the
textarea if both the label and textarea are {float:left;width:100px} ?
the problem im having is when i give the P tag a background colour i get
silly strips of grey that should go all the way around the text area but
dont!

<form id="contact">
<fieldset>
<legend>Enquiry Details</legend>
<p>
<label for="details">Details</label>
<textarea id="details" name="details"></textarea>
</p>
</fieldset>
</form>



 
Reply With Quote
 
 
 
 
Steve Pugh
Guest
Posts: n/a
 
      04-13-2005
"mark | r" <> wrote:

>Using the code below and XHTML how do i get the P tags to contain the
>textarea if both the label and textarea are {float:left;width:100px} ?


What if the user's font size means that your labels don't fit inside
100px?

>the problem im having is when i give the P tag a background colour i get
>silly strips of grey that should go all the way around the text area but
>dont!
>
><form id="contact">
><fieldset>
><legend>Enquiry Details</legend>
><p>
><label for="details">Details</label>
><textarea id="details" name="details"></textarea>
></p>
></fieldset>
></form>


You need an element with clear: left; set inside the <p> but after the
last floated element.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <> <http://steve.pugh.net/>
 
Reply With Quote
 
 
 
 
Els
Guest
Posts: n/a
 
      04-13-2005
mark | r wrote:

> Using the code below and XHTML how do i get the P tags to contain the
> textarea if both the label and textarea are {float:left;width:100px} ?
> the problem im having is when i give the P tag a background colour i get
> silly strips of grey that should go all the way around the text area but
> dont!
>
> <form id="contact">
> <fieldset>
> <legend>Enquiry Details</legend>
> <p>
> <label for="details">Details</label>
> <textarea id="details" name="details"></textarea>
> </p>
> </fieldset>
> </form>


You'll need an element with a clear property after the last floated
element (textarea) inside the containing element (p).
In IE it would be enough to set a height to the containing element, as
it then automatically stretches to encompass the content, even it it's
floated.

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
 
Reply With Quote
 
mark | r
Guest
Posts: n/a
 
      04-13-2005

"Steve Pugh" <> wrote in message
news:...
> "mark | r" <> wrote:
>
> >Using the code below and XHTML how do i get the P tags to contain the
> >textarea if both the label and textarea are {float:left;width:100px} ?

>
> What if the user's font size means that your labels don't fit inside
> 100px?


The label stretches

>
> >the problem im having is when i give the P tag a background colour i get
> >silly strips of grey that should go all the way around the text area but
> >dont!
> >
> ><form id="contact">
> ><fieldset>
> ><legend>Enquiry Details</legend>
> ><p>
> ><label for="details">Details</label>
> ><textarea id="details" name="details"></textarea>
> ></p>
> ></fieldset>
> ></form>

>
> You need an element with clear: left; set inside the <p> but after the
> last floated element.


still doesnt work

thanks
Mark


 
Reply With Quote
 
mark | r
Guest
Posts: n/a
 
      04-13-2005

"Els" <> wrote in message
news:...
> mark | r wrote:
>
> > Using the code below and XHTML how do i get the P tags to contain the
> > textarea if both the label and textarea are {float:left;width:100px} ?
> > the problem im having is when i give the P tag a background colour i get
> > silly strips of grey that should go all the way around the text area but
> > dont!
> >
> > <form id="contact">
> > <fieldset>
> > <legend>Enquiry Details</legend>
> > <p>
> > <label for="details">Details</label>
> > <textarea id="details" name="details"></textarea>
> > </p>
> > </fieldset>
> > </form>

>
> You'll need an element with a clear property after the last floated
> element (textarea) inside the containing element (p).
> In IE it would be enough to set a height to the containing element, as
> it then automatically stretches to encompass the content, even it it's
> floated.


im almost there, ive taken float:left off the input and text area which
makes the textarea work , but the input box not, then ive added a &nbsp;
after each input box which seems to be doing the trick - albeit with &nbsp;s
everywhere


 
Reply With Quote
 
Els
Guest
Posts: n/a
 
      04-13-2005
mark | r wrote:

> "Els" <> wrote in message
> news:...
>> mark | r wrote:
>>
>>> Using the code below and XHTML how do i get the P tags to contain the
>>> textarea if both the label and textarea are {float:left;width:100px} ?
>>> the problem im having is when i give the P tag a background colour i get
>>> silly strips of grey that should go all the way around the text area but
>>> dont!
>>>
>>> <form id="contact">
>>> <fieldset>
>>> <legend>Enquiry Details</legend>
>>> <p>
>>> <label for="details">Details</label>
>>> <textarea id="details" name="details"></textarea>
>>> </p>
>>> </fieldset>
>>> </form>

>>
>> You'll need an element with a clear property after the last floated
>> element (textarea) inside the containing element (p).
>> In IE it would be enough to set a height to the containing element, as
>> it then automatically stretches to encompass the content, even it it's
>> floated.

>
> im almost there, ive taken float:left off the input and text area which
> makes the textarea work , but the input box not, then ive added a &nbsp;
> after each input box which seems to be doing the trick - albeit with &nbsp;s
> everywhere


You just proved to have given incomplete code then. There is no input
element in the above code. You really should provide a URL to a live
and real situation, so people can actually see what you are
doing/trying to accomplish, and what's wrong or right.
Without seeing an example, I can only say "I don't think you need
&nbsp; at all in that form".

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
 
Reply With Quote
 
Steve Pugh
Guest
Posts: n/a
 
      04-13-2005
"mark | r" <> wrote:
>"Steve Pugh" <> wrote in message
>news:.. .
>> "mark | r" <> wrote:
>>
>> >Using the code below and XHTML how do i get the P tags to contain the
>> >textarea if both the label and textarea are {float:left;width:100px} ?

>>
>> What if the user's font size means that your labels don't fit inside
>> 100px?

>
>The label stretches


??? Not in a browser that supports CSS properly it won't. The text
will spill out of the label (give the label a border or background
colour to see) and may overlap adjacent elements.

>> >the problem im having is when i give the P tag a background colour i get
>> >silly strips of grey that should go all the way around the text area but
>> >dont!
>> >
>> ><form id="contact">
>> ><fieldset>
>> ><legend>Enquiry Details</legend>
>> ><p>
>> ><label for="details">Details</label>
>> ><textarea id="details" name="details"></textarea>
>> ></p>
>> ></fieldset>
>> ></form>

>>
>> You need an element with clear: left; set inside the <p> but after the
>> last floated element.

>
>still doesnt work


Then you're doing it wrong. Post a URL showing what you've tried.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <> <http://steve.pugh.net/>
 
Reply With Quote
 
mark | r
Guest
Posts: n/a
 
      04-14-2005
www.so.neue.co.uk/contact.asp

Mark

"Steve Pugh" <> wrote in message
news:...
> "mark | r" <> wrote:
> >"Steve Pugh" <> wrote in message
> >news:.. .
> >> "mark | r" <> wrote:
> >>
> >> >Using the code below and XHTML how do i get the P tags to contain the
> >> >textarea if both the label and textarea are {float:left;width:100px} ?
> >>
> >> What if the user's font size means that your labels don't fit inside
> >> 100px?

> >
> >The label stretches

>
> ??? Not in a browser that supports CSS properly it won't. The text
> will spill out of the label (give the label a border or background
> colour to see) and may overlap adjacent elements.
>
> >> >the problem im having is when i give the P tag a background colour i

get
> >> >silly strips of grey that should go all the way around the text area

but
> >> >dont!
> >> >
> >> ><form id="contact">
> >> ><fieldset>
> >> ><legend>Enquiry Details</legend>
> >> ><p>
> >> ><label for="details">Details</label>
> >> ><textarea id="details" name="details"></textarea>
> >> ></p>
> >> ></fieldset>
> >> ></form>
> >>
> >> You need an element with clear: left; set inside the <p> but after the
> >> last floated element.

> >
> >still doesnt work

>
> Then you're doing it wrong. Post a URL showing what you've tried.
>
> Steve
>
> --
> "My theories appal you, my heresies outrage you,
> I never answer letters and you don't like my tie." - The Doctor
>
> Steve Pugh <> <http://steve.pugh.net/>



 
Reply With Quote
 
mark | r
Guest
Posts: n/a
 
      04-14-2005
www.so.neue.co.uk/contact.asp

Mark
"Els" <> wrote in message
news:z17rhc3l7kc0$....
> mark | r wrote:
>
> > "Els" <> wrote in message
> > news:...
> >> mark | r wrote:
> >>
> >>> Using the code below and XHTML how do i get the P tags to contain the
> >>> textarea if both the label and textarea are {float:left;width:100px} ?
> >>> the problem im having is when i give the P tag a background colour i

get
> >>> silly strips of grey that should go all the way around the text area

but
> >>> dont!
> >>>
> >>> <form id="contact">
> >>> <fieldset>
> >>> <legend>Enquiry Details</legend>
> >>> <p>
> >>> <label for="details">Details</label>
> >>> <textarea id="details" name="details"></textarea>
> >>> </p>
> >>> </fieldset>
> >>> </form>
> >>
> >> You'll need an element with a clear property after the last floated
> >> element (textarea) inside the containing element (p).
> >> In IE it would be enough to set a height to the containing element, as
> >> it then automatically stretches to encompass the content, even it it's
> >> floated.

> >
> > im almost there, ive taken float:left off the input and text area which
> > makes the textarea work , but the input box not, then ive added a &nbsp;
> > after each input box which seems to be doing the trick - albeit with

&nbsp;s
> > everywhere

>
> You just proved to have given incomplete code then. There is no input
> element in the above code. You really should provide a URL to a live
> and real situation, so people can actually see what you are
> doing/trying to accomplish, and what's wrong or right.
> Without seeing an example, I can only say "I don't think you need
> &nbsp; at all in that form".
>
> --
> Els http://locusmeus.com/
> Sonhos vem. Sonhos vão. O resto é imperfeito.
> - Renato Russo -



 
Reply With Quote
 
Els
Guest
Posts: n/a
 
      04-14-2005
mark | r wrote:

> www.so.neue.co.uk/contact.asp


[snip 4 posts worth of text]

a) You know better than topposting.
b) that link doesn't work - probably a wrong content type from the
server or something, as I was asked to download the file.

Please try again later.

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
forms authentication -- expired forms cookie vs. not provided forms cookie Eric ASP .Net Security 2 01-27-2006 10:09 PM
embedded windows forms into web forms for control =?Utf-8?B?ZGF2aWQ=?= ASP .Net 2 04-10-2005 01:07 PM
Creating ASP.NET forms, that act like HTML forms jlopes151 ASP .Net 2 03-14-2005 01:01 AM
Forms Authentication question: How to have some pages open and some requiring forms authentication Eric ASP .Net 2 02-13-2004 02:14 PM
Web Forms VS Windows Forms Brendan Miller ASP .Net 2 08-11-2003 09:05 PM



Advertisments
 



1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57