Home/ Questions/Q 8128919
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-06T08:05:40+00:00

I want to have two input with one button for user to enter their

  • 0

I want to have two input with one button for user to enter their username and password, and
I’m using this css code for controlling the input tag in my website in order to appear it properly on all screen size, and it works fine. 

.controller {
 width: 98%;
 margin: 0;
 padding: 7px 5px 4px;
 color: #555;
 font-size: 18px;
 font-family: inherit;
 border-style: solid;
 border-width: 0 1px 1px 0;
    }

I want to have some dynamic text which is retrieved from the database below these two inputs for the user. Now my problem is that if the text is long it will not appear properly below the inputs and affects them to not fit the screen, as long as the text is only 5 to 10 words there is no problem.

here is the html file for the inputs

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>
<body>
    <form method="post" action="answer">
                <ul>
                    <li>
                        Login Name:<input type="text" name="id" class="controller"></input>
                    </li>
                    <li>
                        Password:<input type="password" name="pass" class="controller"></input>
                    </li>
                    <li>
                        <input type="submit" value="Login"></input>
                    </li>
                </ul>
    </form>     
</body>

and here is the CSS code

 .controller {
 width: 98%;
 margin: 0;
 padding: 7px 5px 4px;
 color: #400;
 font-size: 18px;
 font-family: inherit;
 border-style: solid;
 border-width: 0 1px 1px 0;
    }

please can anyone advice me what I have to do or give a css code for controlling the problem.

thank you very much for any answer and sorry for my long question.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    So, I think that this is what you want to do. After your form,

    <div id="response">
    <p> Some Long Block Of Text That Will Wrap Around This Div </p>
</div>

    then, in the CSS you get something like this going on:

    #response
{
    width: 75px; /*desired width*/
    margin-top: 25px; /*distance from the form above*/
}
#response p
{
    /*anything you want to do to that specific <p> */
}

    ​I’m not sure how you are getting the dynamic text, but I’m guessing that it is a script that is getting info from answer and putting it in the html. Just place that info inside of the <p> that’s in #response

    • 0