|
|
Posted by Chris F.A. Johnson on 10/04/11 11:59
On 2006-09-27, Chris F.A. Johnson wrote:
> On 2006-09-27, Thierry Lam wrote:
>> Can I get some help on how to convert the following table layout into a
>> div/css?
>>
>><table>
>><tr>
>> <td width='120px'><p>Province: </td>
>> <td align='right'>
>> <input type='Text' name='province' size='40' maxlength='50'>
>> </td>
>></tr>
>><tr>
>> <td width='120px'><p>City: </td>
>> <td align='right'>
>> <input type='Text' name='city' size='40' maxlength='50' >
>> </td>
>></tr>
>><tr>
>> <td width='120px'><p>Time in: </td>
>> <td align='right'>
>> <input type='Text' name='inhours' value='' size='2' maxlength='2'>:
>> <input type='Text' name='inminutes' value='' size='2'
>> maxlength='2'>:
>> <input type='Text' name='inseconds' value='' size='2'
>> maxlength='2'> (HH:MM:SS)
>> </td>
>></tr>
>><tr>
>> <td width='120px'><p>Time out: </td>
>> <td align='right'>
>> <input type='Text' name='outhours' value='' size='2'
>> maxlength='2'>:
>> <input type='Text' name='outminutes' value='' size='2'
>> maxlength='2'>:
>> <input type='Text' name='outseconds' value='' size='2'
>> maxlength='2'> (HH:MM:SS)
>> </td>
>></tr>
>></table>
>
>
><head>
><style type="text/css">
> p {
> margin:0;
> padding: .2em 0;
> }
>
> p.label {
> width: 6em;
> float: left;
> clear: both;
> }
In IE, the two look the same without this next section:
> p.r {
> margin-left: 7em;
> padding-left: 7em;
> }
></style>
></head>
><body>
>
><div id="form">
> <p class="label">Province:</p><p><input type='Text'
> name='province' size='40' maxlength='50'>
> <p class="label">City: </p><p><input type='Text'
> name='city' size='40' maxlength='50' >
>
> <p class="label">Time in:</p>
> <p class="r"><input type='Text'
> name='inhours' value='' size='2' maxlength='2'>:
> <input type='Text'
> name='inminutes' value='' size='2' maxlength='2'>:
> <input type='Text'
> name='inseconds' value='' size='2' maxlength='2'> (HH:MM:SS)
>
> <p class="label">Time out:</p>
> <p class="r"><input type='Text'
> name='inhours' value='' size='2' maxlength='2'>:
> <input type='Text'
> name='inminutes' value='' size='2' maxlength='2'>:
> <input type='Text'
> name='inseconds' value='' size='2' maxlength='2'> (HH:MM:SS)
></div>
>
>
--
Chris F.A. Johnson <http://cfaj.freeshell.org>
===================================================================
Author:
Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)
Navigation:
[Reply to this message]
|