SamohtVII Posted August 15, 2014 Share Posted August 15, 2014 Ok so basically I have a table with a form in it and regardless of how much people may hate tables and how porrly coded this may be I need to format the submit button inside the table but nothing seems to work. I have tried the usual like #confirmation #confirm {} table th #confirmation #confirm {} and every combination between that. Can anyone shed some like on how to style the submit button. Thanks <th><form id="confirmation" name="myFormAll" method="post" action="confirm.php"> <input type="number" id="amount" name="amount" style="width:100px;" required min="0" /></th><th> <input type="submit" value="Confirm" id="confirm" /></form></th> Link to comment Share on other sites More sharing options...
davej Posted August 15, 2014 Share Posted August 15, 2014 Why not just... #confirm {} Link to comment Share on other sites More sharing options...
SamohtVII Posted August 15, 2014 Author Share Posted August 15, 2014 (edited) Man if that works -.- brb RE: Nah doesn't work. I don't know why. Any reason why it wouldn't :S Edited August 15, 2014 by SamohtVII Link to comment Share on other sites More sharing options...
dsonesuk Posted August 15, 2014 Share Posted August 15, 2014 (edited) You can't divide opening and closing tags of form into separate th, they must in a single th or td element OR the table must be inside the opening/closing form tags, where you would place input elements in th or td. Edited August 15, 2014 by dsonesuk Link to comment Share on other sites More sharing options...
johncc Posted August 15, 2014 Share Posted August 15, 2014 (edited) Why not just... #confirm {} Man if that works -.- brb RE: Nah doesn't work. I don't know why. Any reason why it wouldn't :S It is not like any table that I have used but Dave's suggestion does work. <html><head><style>#confirm { color:red;}</style></head><body><th><form id="confirmation" name="myFormAll" method="post" action="confirm.php"> <input type="number" id="amount" name="amount" style="width:100px;" required min="0" /></th><th> <input type="submit" value="Confirm" id="confirm" /></form></th></body></html> Edited August 15, 2014 by johncc Link to comment Share on other sites More sharing options...
dsonesuk Posted August 15, 2014 Share Posted August 15, 2014 Yes! using #confirm should work because you are targeting the element directly using its id ref. Using invalid html as in #1 post, will produce from the browser its interpretation of correct layout of form, for example. <!DOCTYPE html><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta name="viewport" id="viewport" content="target-densitydpi=high-dpi,initial-scale=1.0,user-scalable=no" /> <title>Document Title</title> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script> <script type="text/javascript"> </script> <style type="text/css"> #confirm {color: red;} </style> </head> <body> <table><tr> <th><form id="confirmation" name="myFormAll" method="post" action="confirm.php"> <input type="number" id="amount" name="amount" style="width:100px;" required min="0" /></form> </th> <th> <input type="submit" value="Confirm" id="confirm" /> </th></tr></table></body></html> which means #confirmation #confirm {} table th #confirmation #confirm {} will have no effect because #confirm is outside #confirmation Link to comment Share on other sites More sharing options...
davej Posted August 15, 2014 Share Posted August 15, 2014 As the others have said it is unusual to try to place a form inside a portion of a table. It would be better to have the form enclose the entire table or reside inside a single cell. Link to comment Share on other sites More sharing options...
happycodings Posted August 28, 2014 Share Posted August 28, 2014 (edited) Align the form controls with table<?xml version="1.0" ?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"><head> <title>Align the form controls with table</title></head><body><h2>Reply to seller</h2><p>Use the following form to respond to seller:</p><form action="" method="post" name="frmRespond"><table> <tr> <td><label for="emailTo">To</label></td> <td><input type="text" name="txtTo" readonly="readonly" id="emailTo" size="25" value="Phone seller" /></td> </tr> <tr> <td><label for="emailFrom">To</label></td> <td><input type="text" name="txtFrom" id="emailFrom" size="25" /></td> </tr> <tr> <td><label for="emailSubject">Subject</label></td> <td><input type="text" name="txtSubject" id="emailSubject" size="60" /></td> </tr> <tr> <td><label for="emailBody">Body</label></td> <td><textarea name="txtBody" id="emailBody" cols="60" rows="12"> </textarea></td> </tr></table><input type="submit" value="Send email" /></form></body></html> Edited August 30, 2014 by Ingolme Advertising Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now