asked on

Can't find an open element in HTML

I'm can't get a text box to align to the left. The source code view in the browser says that there is an open element after the display of "First Name". I can't see it.

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<style>
div.background {
  background: url(Images/nyc7.jpg);
  height: 535px;
  border: 1px solid black;
}

div.transbox {
  margin: 30px;
  background-color: #ffffff;
  border: 1px solid black;
  opacity: 0.5;
  filter: alpha(opacity=60); /* For IE8 and earlier */
}

div.transbox p {
  margin: 5%;
  font-size:40px;
  font-weight: bold;
  color: #000000;
  align: center;
}
div.about {
  margin: 12px;
  background-color: #e6e6ff;
  border: 1px solid black;
  padding-right: 10px;
  padding-left: 10px;
  opacity: 1.5;
  filter: alpha(opacity=60); /* For IE8 and earlier */
}

</style>
</head>
<body>

<table width="100%" bgcolor="#FFFFFF" border="0">
 <tr>
  <td>
   <img src="Images/Lang_Logo_PDF.jpg" width = "140" height =  "60" >
  </td>
    <td align = "right">
		<!-- Home Button -->
   		<a href="m1.php" class="nof-navButtonAnchor"><img alt="Home" title="Home"/></a>
		<!-- End Home Button -->
		<!-- About  Button -->   
		<a href="about.php" class="nof-navButtonAnchor"><img alt="About" title="About"/></a>
		<!-- End About By Button -->
		<!-- Request Demo Button -->  
  		<a href="demo.php" class="nof-navButtonAnchor"><img alt="Contacts" title="Contacts"/></a>
		<!-- End About By Button -->          
  									
			
	
           
 <!-- Retail Button -->                
			<a href="http://mrbreeze.net/test/index.php" class="nof-navButtonAnchor"><img id="NavigationButton2" name="NavigationButton2" height="60" width="150" src="../Retail_Np_regular_1.png" border="0" alt="Retail" title="Retail"/></a>
			<!-- End Retail Button -->                      
  </td>
 </tr>  
 </table>
<div class="background">
<div class="about">
   	<form name="form1" method="post" action="demo_send.php">
	<table width="100%">
    	<tr width = "100%">
	        <td width = "100%" align = "center" style = "font-size: 25px;">
Contact Lang Systems</td>
        </tr>
         <tr>
         
        	<td width = "10%" align = "left"><font color="red">* <font color="black">First Name:[b][u]</td>[/u][/b]
 		<td style="padding-left:15px">
        	<input type="text" name="first_name" maxlength="50" size="30" title="First Name - This is a required field.">
 </td>            
		</tr>            
</table>
</form>
</div>
</div>
	

</body>

</html>

Open in new window

I've attached the code and a screen clip of what I'm getting.
demo.php
demo.JPG

ASKER CERTIFIED SOLUTION

Ray Paseur

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Nicholas

Issue is the header row needs colspan=2 as its covering two columns

Don't see how the accepted solution is valid, nothing to do with css

Julian Hansen

Notwithstanding the fact that the markup is invalid on a number of counts
1. Using table for layout
2. Invalid / obsolete attributes and tags used

On line 78 you have some EE formatting specifiers - which I am assuming you put in to highlight where the problem was supposed to be - except the formatting tags don't work in a code snippet - assume they don't exist in your source.

Secondly, you have <font> tags (which are deprecated) that don't have closing tags.

As Nicholas points out though - and what you would see if you ran your code through here https://validator.w3.org/nu/ is the following

Warning: A table row was 2 columns wide and exceeded the column count established by the first row (1).

Advice: move away from tables for layout - take a look at Bootstrap as an alternative for laying out your forms.

Ray Paseur

@Julian: I think that was item #24

Julian Hansen

Apologies Ray - I made the same mistake and assumed your 21 / 24 referred to line numbers of the code - long day.