Appnitro Software Forums » MachForm

Label & Input box on same line

(5 posts)
  • Started 9 months ago by prajwalrao
  • Latest reply from xlawdog

  1. prajwalrao
    Member

    Is this possible easily? If yes can anyone shed some light please..

    Thanks..

    Posted 9 months ago #
  2. I haven't test this a lot yet, but it might be a good start.

    Edit the CSS of your form, search for this block:

    label.description
    {
    	border:none;
    	color:#222;
    	display:block;
    	font-size:95%;
    	font-weight:700;
    	line-height:150%;
    	padding:0 0 1px;
    }

    Add width and float attribute to that code, so it become:

    label.description
    {
    	border:none;
    	color:#222;
    	display:block;
    	font-size:95%;
    	font-weight:700;
    	line-height:150%;
    	padding:0 0 1px;
    	width: 30%;
    	float: left;
    }

    That should align most of the labels and input to be the same line.

    Next, search for this block:

    textarea.textarea
    {
    	background:#fff url(../../../images/shadow.gif) repeat-x top;
    	border-bottom:1px solid #ddd;
    	border-left:1px solid #c3c3c3;
    	border-right:1px solid #c3c3c3;
    	border-top:1px solid #7c7c7c;
    	color:#333;
    	font-family:"Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
    	font-size:100%;
    	margin:0;
    	width:99%;
    }

    Change the width to be 50% instead of 99%, this should fix the paragraph alignment.

    Posted 9 months ago #
  3. prajwalrao
    Member

    Thank you so much. That worked like a charm... :)

    Posted 9 months ago #
  4. Sounds great!

    Posted 9 months ago #
  5. xlawdog
    Member

    I used this style for a couple of my forms and also aligned the label text to the right. I added width and float to label.description, and also added text-align: right. Instead of reducing the width of the input, I added rules for li.div - float: right and width x%. I haven't tested it in all browsers, but it works so far in the ones I have tested.

    Posted 9 months ago #

RSS feed for this topic

Reply

You must log in to post.