Solved

Text placement using CSS

Posted on 1997-12-08
4
190 Views
Last Modified: 2013-12-25
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
Comment
Question by:m110585
  • 3
4 Comments
 
LVL 1

Accepted Solution

by:
serobert earned 100 total points
ID: 1855883
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
 
LVL 1

Expert Comment

by:serobert
ID: 1855884
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
 
LVL 1

Expert Comment

by:serobert
ID: 1855885
same goes with "height="74"".  Sorry about that, the editor I used to layout the table took a crap.
0
 

Author Comment

by:m110585
ID: 1855886
Turns out that IE 3.02 (4.70.1300) doesn't display what I'm trying to do in CSS. :-(
0

Featured Post

Master Your Team's Linux and Cloud Stack

Come see why top tech companies like Mailchimp and Media Temple use Linux Academy to build their employee training programs.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I've been asked to discuss some of the UX activities that I'm using with my team. Here I will share some details about how we approach UX projects.
This article will inform Clients about common and important expectations from the freelancers (Experts) who are looking at your Gig.
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
The is a quite short video tutorial. In this video, I'm going to show you how to create self-host WordPress blog with free hosting service.

770 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question