2 replies [Last post]
itechieguy.com
Offline
newbie
Last seen: 9 years 46 weeks ago
Timezone: GMT-8
Joined: 2012-02-13
Posts: 6
Points: 11

I created a bit of sample code for a table. It works in "naked" HTML. When I put it into Wordpress, all the alignments go to left on me. After a bit of exploration, i found my problem happened because of a definition of td in a reset.css file.

Here is the code. Check out the comment in the style block.

<!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">
<head>
<title>litend test</title>
<style type="text/css">
/*This is what causes the problem from the reset.css file*/
/*with this next block commented out, the alignment is correct*/
/*with this next block commented in, the alignment shifts to left*/
/*
caption, th, td {
    text-align: left;
    font-weight: normal;
}
*/
span.Rd {color:red;font-weight:bold;}
span.Be {color:blue;font-weight:bold;}	
</style>
</head>
 
<body>
            <table border="1.0" cellpadding="5.0" cellspacing="0.0" bordercolor="000000" width=20%>
            <tr bgcolor ="bebebe">	
              <td text-align="center" width="0"><span><b>SERVICE-make this longer<br/></span></td>
            	<td text-align="center" width="0"><span> Done <span class="Rd">FOR</span> You<br/></span></td>
            	<td text-align="center" width="0"><span> Done <span class="Be">WITH</span> You<br/></span></td>
            </tr>
            </table>
        </body>
</html>

I thought what I did with the td blocks would override what had been previously defined, but its not.

Anyone have great wisdom to impart on me?

itechieguy.com
Offline
newbie
Last seen: 9 years 46 weeks ago
Timezone: GMT-8
Joined: 2012-02-13
Posts: 6
Points: 11

question about css with TD alignment:solved

I hate the fact the so many of the search for html elements goes to posts are are years old and outdated. I going to stop searching for html and search for CSS. Maybe that will give me better results.

itechieguy.com
Offline
newbie
Last seen: 9 years 46 weeks ago
Timezone: GMT-8
Joined: 2012-02-13
Posts: 6
Points: 11

question about css with TD alignment:solution

Here is what I came up with for my solution

<!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">
<head>
<title>litend test</title>
<style type="text/css">
caption, th, td {
    text-align: left;
    font-weight: normal;
}
table.re-table {
	border-width: 1px;
	border-spacing: 2px;
	border-style: solid;
	border-color: black;
	border-collapse: collapse;
	background-color: white;
	width:20%;
}
tr.mediumGray{
  background-color:#bebebe;
}
table.re-table td {
	border-width: 1px;
	padding: 4px;
	border-style: solid;
	border-color: black;
}
td.mediumGray{
  background-color:#bebebe;
}
td.lighterGray{
  background-color:#dedede;
}
td.white{
  background-color: white;
}
td.left{text-align: left;width:0;}
td.center{text-align: center;width:0;}
 
span.Rd {color:red;font-weight:bold;}
span.Be {color:blue;font-weight:bold;}
</style>
 
</head>
 
  <body>
    <table class="re-table">
      <tr>	
        <td class="mediumGray center"><span><b>SERVICE-make this longer</b><br/></span></td>
      	<td class="lighterGray left"><span> Done <span class="Rd">FOR</span> You<br/></span></td>
      	<td class="white center"><span> Done <span class="Be">WITH</span> You<br/></span></td>
      </tr>
    </table>
  </body>
</html>