Having a problem in IE with CSS nowrap in IE, works perfectly in Chrome. Can anyone help out so it renders without any wrapping in IE and Chrome?
HTML
<div id="sub_cont"></div>
CSS
#content{
height:14px;
text-align: left;
text-decoration: none;
width: 450px;
padding-top:25px;
white-space: nowrap;
}
#content #sub_cont{
width: 450px;
display:none;
height:14px;
}
#content .no-rec{
color:#000;
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
padding:5px;
border-bottom:solid #000;
text-align:left;
background:#EBEBEB;
}
#content .each_rec {
background: none repeat scroll 0 0 #EBEBEB;
border-bottom: medium solid #000000;
color: #000;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
padding: 5px;
height:12px;
}
PHP
<?php
echo "<h2>Search Result</h2>";
echo "<table border='0' id='content' cellspacing='2' cellpadding='5'>
<tr bgcolor='#FFFFCC'>
<th>VM Name</th>
<th>vCenter Name</th>
</tr>";
while ($row = sqlsrv_fetch_array($result))
{
echo "<tr class='each_rec'>";
echo "<td>" . $row['VM_NAME'] . "</td>";
echo "<td>" . $row['VCENTER_NAME'] . "</td>";
echo "</tr>";
}
echo "</table>";
if($total==0){ echo '<div class="no-rec">No Record Found !</div>';}?>
In internet explorer we must use the whiteSpace property in order to nowrap text, the documentation for the usage of whiteSpace is linked below. Good luck, and remember to use the most recent version of IE in order to maintain accuracy.
Link: http://msdn.microsoft.com/en-us/library/ie/ms531182(v=vs.85).aspx