Posted by Els on 12/11/05 10:43

bennett.sean@gmail.com wrote:

> Hi, what I want to do is as follows via html:
>
> -------Contact---------------------------------------------------------------------
>
> -------Classes---------------------------------------------------------------------
>
> --------Other Stuff Goes
> Here------------------------------------------------
>
> In otherwords,
>
> 1) a fixed width line at the start,
> 2) a title
> 3) a variable width line which makes the entire thing always the same
> width in pixels
>
> I've tried the following unsuccessfully:
>
> <table>
> <tr>
> <td width = "50">
> <hr />
> </td>
> <td width = "150">
> Contact
> <hr />
> <td>
> <hr width="600"/>
> </td>
> </tr>
> </table>

Since you're a newbie, skip learning tables and go straight to today's
method of webdesign. No tables unless it's for real tabular data.

If I understand correctly what you want, you'd be best off using a
background image for the horizontal line, and making the background of
the word a solid colour, so it will not show the background image
behind it.

Presuming they are subheadings:

HTML:

<h2><span>Contact</span></h2>
<h2><span>Classes</span></h2>
<h2><span>Other Stuff</span></h2>

CSS:

h2{
width:800px;
background:url(hr.gif) repeat-x center;
padding-left:50px;
}
h2 span{
color:black;
background:white;
}

Personally I'd leave the width of the h2 out though, so that people on
a narrower window will not get a horizontal scrollbar.

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -

[Back to original message]