Jump to content

Terrible looking form


Noskiw

Recommended Posts

6y8pwwwv1_help1.jpg

 

I want to make everything aligned up with each other. And the Body label to be at the top of the textarea. This is the code that I have :)

 

<form method="post" action="index.php" style="text-align: left;">

    <input type="hidden" name="add" value="true" />
    
    <div><tr><td> Title: </td><td><input type="text" name="title" id="title" /></td></tr></div>
        
    <div><tr><td>Body: </td><td><textarea name="body" rows="8" cols="60" id="body" style="width: 40%;"></textarea></td></tr></div>
    
    <input type="submit" name="submit" value="Post!" />

</form>

 

Can anyone help me please? :D

Link to comment
https://forums.phpfreaks.com/topic/208091-terrible-looking-form/
Share on other sites

I assume you'll need my new code and also the CSS code for it...

 

<form method="post" action="index.php">

    <input type="hidden" name="add" value="true" />
    
    <div id="mainbody" style="text-align: left">
    <tr><td>Title:  </td><td><input type="text" name="title" /></td></tr><br />
    <tr><td>Body: </td><td><textarea name="body" rows="8" cols="40"></textarea></td></tr>
    
    <tr><td><input type="submit" name="submit" value="Post!" /></td></tr>
    </div>

</form>

 

body{
    font-family: Arial;
    font-size: 18px;
    color: #FFF;
    background-color: #000;
}

#header{
    width: auto;
    border: 1px solid #FFF;
    height: 200px;
    padding: 5px;
}

#body{
    width: 1200px;
    border: 1px solid #FFF;
    padding: 5px;
}

#mainbody{
    width: auto;
    height: auto;
    padding: 10px;
    border: 1px solid #FFF;
    text-align: right;
    overflow:hidden;
}

#navbar{
    font-size: 16px;
    width: auto;
    height: 25px;
    line-height: 22px;
    font-weight: bold;
    background: #000;
    border: 1px solid #FFF;
    border-top: 0px;
}

.button a{
    float: left;
    width: 150px;
    height: 25px;
    color: #FFF;
    text-decoration:none;
    text-align: center;
    border-right: 1px solid #FFF;
}

.button a:hover{
    float: left;
    width: 150px;
    height: 25px;
    color: #fff;
    text-decoration:underline;
    text-align: center;
    background: #7000cf;
    border-right: 1px solid #FFF;
}

#navbara{
    font-size: 16px;
    width: auto;
    height: 25px;
    line-height: 22px;
    font-weight: bold;
    background: #000;
    border: 1px solid #FFF;
}

.buttona a{
    float: right;
    width: 150px;
    height: 25px;
    color: #FFF;
    text-decoration:none;
    text-align: center;
    border-left: 1px solid #FFF;
}

.buttona a:hover{
    float: right;
    width: 150px;
    height: 25px;
    color: #fff;
    text-decoration:underline;
    text-align: center;
    background: #7000cf;
    border-left: 1px solid #FFF;
}

#login_box{
    font-size: 16px;
    color: #FFF;
    width: 1188px;
    border-right:1px solid #FFF;
    border-left:1px solid #FFF;
    border-bottom: 1px solid #FFF;
    padding:5px;
    text-align:right;
    height: 25px;
}


a{
    color: #FFF;
    font-weight: bold;
    text-decoration: none;
}

a:hover{
    color: #FFF;
    font-weight: bolder;
    text-decoration: underline;
}

#footer{
    border: 1px solid #FFF;
    padding: 5px;
}

.a{float:right; padding: 10px;}

.b{float:left; padding: 10px;}

.li{float:left;}

.fltlft{float: left;}

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.