Russia Posted November 7, 2009 Share Posted November 7, 2009 I currently have this css: input{ font-size:12px; padding:4px 2px; border:solid 1px #675f39; } </style> and this form: <form action="accounts-password.php" AUTOCOMPLETE = "off" method="POST"> <input type="hidden" name="member" value="1" /> <span style="float: left;"> Your old Password: </span> <span style="float: right;"> <input size="40" class="only" type="password" name="oldpass"> </span> <br><br> <hr> <span style="float: left;"> Your New Password: </span> <span style="float: right;"> <input size="40" type="password" name="newpass"> </span> <br><br> <span style="float: left;"> Re-Type Your New Password: </span> <span style="float: right;"> <input size="40" type="password" name="veri"> </span> <br><br> <hr> <center> <input name="chpass" id="submit" type="submit" value="Change Password" > </center> </form> I only want css style for the input textboxes like: <input size="40" type="password" name="newpass"> For some reason Its giving me a css style for the submit button: <input name="chpass" id="submit" type="submit" value="Change Password" > How do I do it so the submit button stays default like with no css added to it, but the input text boxes still keep it? I guess its because they are both starting with the '<input', not sure. Quote Link to comment Share on other sites More sharing options...
cags Posted November 7, 2009 Share Posted November 7, 2009 Yes, they are both changing because they are both input elements. Your most consistent bet is to give the textbox a class or id and style it based on that class/id. If theres only the one then I'd probalby use id, if theres multiple ones to style then use a class. It is possible in supported browsers to do this... input[type='text'] { ... but not all browsers support it (namely IE 6 I think). Quote Link to comment Share on other sites More sharing options...
Dorky Posted November 7, 2009 Share Posted November 7, 2009 also it will not render properly in those that do support it unless you use <button Quote Link to comment Share on other sites More sharing options...
Russia Posted November 7, 2009 Author Share Posted November 7, 2009 Okay, well I have done it my way and it works perfect. I got a new problem: I want this: <span style="float: left;"> Main News Message: </span> <span style="align: right;"> <textarea style="border:solid 1px #675f39; padding:4px 2px;" name="mainnewsmessage" cols="40" rows="8"> <?php echo $row['mainnewsmessage']; ?> </textarea> </span> <hr> I want the textbox to align at the right, right now its not working and aligning right next to the 'Main News Message:' text. It would work before: <span style="float: left;"> Main News Message: </span> <span style="float: right;"> <textarea style="border:solid 1px #675f39; padding:4px 2px;" name="mainnewsmessage" cols="40" rows="5"> <?php echo $row['mainnewsmessage']; ?> </textarea> </span> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <hr> But I would have to add alot of: <br /> <br /> <br /> <br /> <br /> <br /> <br /> <hr> to it... Quote Link to comment Share on other sites More sharing options...
Dorky Posted November 7, 2009 Share Posted November 7, 2009 align is not a css property. text-align or float. Quote Link to comment Share on other sites More sharing options...
Russia Posted November 7, 2009 Author Share Posted November 7, 2009 Okay, so whats the correct way of doing it, to shorten the code so it without all those <br> in a row? I got this: Now about my old problem: I want this: <span style="float: left;"> Main News Message: </span> <span style="float: right;"> <textarea class="myform" name="mainnewsmessage" cols="40" rows="5"> <?php echo $row['mainnewsmessage']; ?> </textarea> </span> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <hr> But I would have to add alot of: <br /> <br /> <br /> <br /> <br /> <br /> <br /> to it... My css: <style type="text/css"> input.theform { border:solid 1px #675f39; padding:4px 2px; } textarea.theform { border:solid 1px #675f39; padding:4px 2px; } </style> What do I do about that? Quote Link to comment Share on other sites More sharing options...
cags Posted November 7, 2009 Share Posted November 7, 2009 Add a bottom margin to the span. Quote Link to comment Share on other sites More sharing options...
Russia Posted November 7, 2009 Author Share Posted November 7, 2009 What do U mean? Like this? <style type="text/css"> input.theform { border:solid 1px #675f39; padding:4px 2px; } textarea.theform { border:solid 1px #675f39; padding:4px 2px; margin: 1px 2px 3px 4px; } </style> Quote Link to comment Share on other sites More sharing options...
cags Posted November 7, 2009 Share Posted November 7, 2009 Adding a random margin to each side is not going to help is it? If you want space below the span then you give the span a bottom margin, which will prevent any other item going into that space. margin-bottom: 100px; Whether you want the margin on the span or the textbox is dependent on the exact result your after. Quote Link to comment Share on other sites More sharing options...
Russia Posted November 7, 2009 Author Share Posted November 7, 2009 Can you show me what you mean?? This is what I have atm: --- <span style="float: left;"> Main News Message: </span> <textarea class="theform" name="mainnewsmessage" cols="40" rows="5">You may recognize the Poison Arrow pub and the aquanite from our Guaranteed Content polls. Everything in the Poison Arrow came from in-game suggestions and the forums. And thats not all: beware of aquanites...</textarea> <hr> and the css: <style type="text/css"> input.theform { border:solid 1px #675f39; padding:4px 2px; } textarea.theform { border:solid 1px #675f39; padding:4px 2px; [b] align: right;[/b] } </style> Quote Link to comment Share on other sites More sharing options...
cags Posted November 7, 2009 Share Posted November 7, 2009 Well in that case no, margin will do no use, but I can't see how <br> will either... Quote Link to comment Share on other sites More sharing options...
Russia Posted November 7, 2009 Author Share Posted November 7, 2009 Here is my whole form: <form AUTOCOMPLETE = "off" action="<?php echo $_SERVER['PHP_SELF'] ?>" method="post"> <span style="float: left;"> Website Title: </span> <span style="float: right;"> <input class="theform" size="40" name="title" value="<?php echo $row['title']; ?>"> </span> <br><br> <span style="float: left;"> Website Url/Link: </span> <span style="float: right;"> <input class="theform" size="40" name="url" value="<?php echo $row['url']; ?>"> </span> <br><br> <hr> <span style="float: left;"> Main News Title: </span> <span style="float: right;"> <input class="theform" size="40" name="mainnewstitle" value="<?php echo $row['mainnewstitle']; ?>"> </span> <br><br> <span style="float: left;"> Main News Date: </span> <span style="float: right;"> <input class="theform" size="40" name="mainnewsdate" value="<?php echo $row['mainnewsdate']; ?>"> </span> <br><br> <span style="float: left;"> Main News Image: </span> <span style="float: right;"> <input class="theform" size="40" name="mainnewsimage" value="<?php echo $row['mainnewsimage']; ?>"> </span> <br><br> <span style="float: left;"> Main News 'Read More' link: </span> <span style="float: right;"> <input class="theform" size="40" name="mainnewslink" value="<?php echo $row['mainnewslink']; ?>"> </span> <br><br> <span style="float: left;"> Main News Message: </span> <textarea class="theform" name="mainnewsmessage" cols="40" rows="5"> <?php echo $row['mainnewsmessage']; ?> </textarea> <hr> <span style="float: left;"> First News Title: </span> <span style="float: right;"> <input class="theform" size="40" name="firstnewstitle" value="<?php echo $row['firstnewstitle']; ?>"> </span> <br><br> <span style="float: left;"> First News Date: </span> <span style="float: right;"> <input class="theform" size="40" name="firstnewsdate" value="<?php echo $row['firstnewsdate']; ?>"> </span> <br><br> <span style="float: left;"> First News Message: </span> <span style="float: right;"> <textarea class="theform" name="firstnewsmessage" cols="40" rows="5"><?php echo $row['firstnewsmessage']; ?> </textarea> </span> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <hr> <span style="float: left;"> Second News Title: </span> <span style="float: right;"> <input class="theform" size="40" name="secondnewstitle" value="<?php echo $row['secondnewstitle']; ?>"> </span> <br><br> <span style="float: left;"> Second news Date: </span> <span style="float: right;"> <input class="theform" size="40" name="secondnewsdate" value="<?php echo $row['secondnewsdate']; ?>"> </span> <br><br> <span style="float: left;"> Second News Message: </span> <span style="float: right;"> <textarea class="theform" name="secondnewsmessage" cols="40" rows="5"><?php echo $row['secondnewsmessage']; ?> </textarea> </span> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <hr> <span style="float: left;"> Third News Title: </span> <span style="float: right;"> <input class="theform" size="40" name="thirdnewstitle" value="<?php echo $row['thirdnewstitle']; ?>"> </span> <br><br> <span style="float: left;"> Third News Date: </span> <span style="float: right;"> <input class="theform" size="40" name="thirdnewsdate" value="<?php echo $row['thirdnewsdate']; ?>"> </span> <br><br> <span style="float: left;"> Third News Message: </span> <span style="float: right;"> <textarea class="theform" name="thirdnewsmessage" cols="40" rows="5"><?php echo $row['thirdnewsmessage']; ?> </textarea> </span> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <hr> <center> <input type="submit" name="submit" id="submit" value="Save" /> </center> </form> Look and see for yourself. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.