Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 197
  • Last Modified:

Text placement using CSS

How can I get the bottom edge of text to sit flush on the bottom border of a single-cell table using CSS?

I need to create a 300x150 px red box with the word SAMPLE sitting FLUSH on the bottom of the box.
0
m110585
Asked:
m110585
  • 3
1 Solution
 
serobertCommented:
This should work, but if you need any more help, please let me know.  You can email me at seanrobertson@hotmail.com

<html>
<head>
<title>DHTML Test</title>
<style type="text/css">
#sample {font-size:18pt}
</style>
</head>
<body bgcolor="#FFFFFF">
<h1>Sample</H1>
<table border="0" width="300" height="150" cellspacing="0" cellpadding="0">
  <tr valign="BOTTOM">
    <td bgcolor="#FF0000" width="359" valign="BOTTOM" height="74">
      <div id="Layer1" style="position:relative; left:97; top:25; width:98; height:20; z-index:1;">
        <span ID="sample">SAMPLE</span>
      </div>
    </td>
  </tr>  
</table>
</body>
</html>
0
 
serobertCommented:
the width attribute in the following line (which appeared in the table of the previous code):
<td bgcolor="#FF0000" width="359" valign="BOTTOM" height="74">
 can be removed so that the line appears as:
<td bgcolor="#FF0000" valign="BOTTOM" height="74">
It doesn't make any difference, but is just cleaner coding.
0
 
serobertCommented:
same goes with "height="74"".  Sorry about that, the editor I used to layout the table took a crap.
0
 
m110585Author Commented:
Turns out that IE 3.02 (4.70.1300) doesn't display what I'm trying to do in CSS. :-(
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now