By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
454,618 Members | 1,543 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 454,618 IT Pros & Developers. It's quick & easy.

how to specify a three-part header?

P: n/a
I just google-searched this group and could not find any references to
this. I'm trying to figure out how to specify a three-part header with
html. For example,

left part center part right part

For old troffists, this is what the .tl construct does. But how would it
be done in html? I tried <div align = left>left part</div>
<div align = center> ..., which almost worked, except each part is on a new
line - not quite what I want.

It looks like the COL construct in a table might do what I want - <col
align = left> <col align = center> <col align = right>, but my browser,
mozilla 1.5, ignores it.

Am I out of luck?

Thanks!

--
Jim Cochrane; jt*@dimensional.com
[When responding by email, include the term non-spam in the subject line to
get through my spam filter.]
Jul 20 '05 #1
Share this Question
Share on Google+
12 Replies


P: n/a
Els
Jim Cochrane wrote:
I just google-searched this group and could not find any references to
this. I'm trying to figure out how to specify a three-part header with
html. For example,

left part center part right part

For old troffists, this is what the .tl construct does. But how would it
be done in html? I tried <div align = left>left part</div>
<div align = center> ..., which almost worked, except each part is on a new
line - not quite what I want.

It looks like the COL construct in a table might do what I want - <col
align = left> <col align = center> <col align = right>, but my browser,
mozilla 1.5, ignores it.

Am I out of luck?


Not necessarily ;-)
You need floats.
http://www.w3.org/TR/REC-CSS2/visuren.html#floats

--
Els

Sonhos vem. Sonhos vo. O resto imperfeito.
- Renato Russo -

Jul 20 '05 #2

P: n/a
In article <sl****************@shell.dimensional.com>,
Jim Cochrane <jt*@shell.dimensional.com> wrote:
I just google-searched this group and could not find any references to
this. I'm trying to figure out how to specify a three-part header with
html. For example,

left part center part right part


Steal it. <http://www.heddes.nl/>

--
Kris
<kr*******@xs4all.netherlands> (nl)
<http://www.cinnamon.nl/>
Jul 20 '05 #3

P: n/a
On 3 Mar 2004 01:04:52 -0700, Jim Cochrane <jt*@shell.dimensional.com>
wrote:
I just google-searched this group and could not find any references to
this. I'm trying to figure out how to specify a three-part header with
html. For example,

left part center part right part


I think my three-part footer does what you need - see sig.

--
Stephen Poley

http://www.xs4all.nl/~sbpoley/webmatters/
Jul 20 '05 #4

P: n/a
On 3 Mar 2004 01:04:52 -0700, Jim Cochrane <jt*@shell.dimensional.com>
wrote:
I just google-searched this group and could not find any references to
this. I'm trying to figure out how to specify a three-part header with
html. For example,

left part center part right part

For old troffists, this is what the .tl construct does. But how would it
be done in html? I tried <div align = left>left part</div>
<div align = center> ..., which almost worked, except each part is on a
new
line - not quite what I want.

It looks like the COL construct in a table might do what I want - <col
align = left> <col align = center> <col align = right>, but my browser,
mozilla 1.5, ignores it.

Am I out of luck?

Thanks!


Get rid of those ugly tables.

<div id="header">
<div id"=headleft">Left side content</div>
<div id"=headright">right side content</div>
<div id"=center">Center content</div>
</div>

Choose more content-descriptive names for the id's. And put them in this
order.

Style: #header {position: relative;} #headleft {float: left; width:30%;}
#headright {float: right; width:30%;} #center {margin-left: 32%;
margin-right: 32%;}

And the next div after #header is set clear: both to be safe. This might
not be plug-in ready, but it's tweakable to what you need.

Jul 20 '05 #5

P: n/a
On Wed, 03 Mar 2004 10:01:56 -0500, Neal <ne*****@spamrcn.com> wrote:
<div id="header">
<div id"=headleft">Left side content</div>
<div id"=headright">right side content</div>
<div id"=center">Center content</div>
</div>


Correcting my typos - all those divs are supposed to be <div
id="thenameofthediv">, not <div id"=...
Jul 20 '05 #6

P: n/a
In article <rl********************************@4ax.com>, Stephen Poley wrote:
On 3 Mar 2004 01:04:52 -0700, Jim Cochrane <jt*@shell.dimensional.com>
wrote:
I just google-searched this group and could not find any references to
this. I'm trying to figure out how to specify a three-part header with
html. For example,

left part center part right part


I think my three-part footer does what you need - see sig.


I like your site, but I could not find anything on a 3-part footer. I used
the search facility but did not see anything that looked relevant.

Can you give me a hint as to where it is on your site?

Thanks!
--
Jim Cochrane; jt*@dimensional.com
[When responding by email, include the term non-spam in the subject line to
get through my spam filter.]
Jul 20 '05 #7

P: n/a
On 3 Mar 2004 11:15:17 -0700, Jim Cochrane <jt*@shell.dimensional.com>
wrote:
In article <rl********************************@4ax.com>, Stephen
Poley wrote:


[snip]
I think my three-part footer does what you need - see sig.


I like your site, but I could not find anything on a 3-part footer.
I used the search facility but did not see anything that looked
relevant.

Can you give me a hint as to where it is on your site?


His site *uses* a three-part footer: the links are one part, the W3C icons
are the second, and his name is the third. :)

Mike

--
Michael Winter
M.******@blueyonder.co.invalid (replace ".invalid" with ".uk" to reply)
Jul 20 '05 #8

P: n/a
In article <op**************@news-text.blueyonder.co.uk>, Michael Winter wrote:
On 3 Mar 2004 11:15:17 -0700, Jim Cochrane <jt*@shell.dimensional.com>
wrote:
In article <rl********************************@4ax.com>, Stephen
Poley wrote:


[snip]
I think my three-part footer does what you need - see sig.


I like your site, but I could not find anything on a 3-part footer.
I used the search facility but did not see anything that looked
relevant.

Can you give me a hint as to where it is on your site?


His site *uses* a three-part footer: the links are one part, the W3C icons
are the second, and his name is the third. :)

Mike


Ah - how unobservant of me. Thanks for pointing this out.

However, I tried copying the page and am having some trouble with it. I
may be missing something obvious, but when I saved the site as a set of
files and point my browser to the main page file, the 3-part footer flops -
All three parts become left justified. When I point my browser to the
original page: http://www.xs4all.nl/~sbpoley/webmatters/, the layout of the
footer is as expected.

Can anyone help me figure out what I'm missing here? (The auxiliary files
under Web Matters - Main Page_files/ were also saved and I verified that they
were read when the main page loaded.)
--
Jim Cochrane; jt*@dimensional.com
[When responding by email, include the term non-spam in the subject line to
get through my spam filter.]
Jul 20 '05 #9

P: n/a
On 3 Mar 2004 13:44:40 -0700, Jim Cochrane <jt*@shell.dimensional.com>
wrote:
However, I tried copying the page and am having some trouble with it. I
may be missing something obvious, but when I saved the site as a set of
files and point my browser to the main page file, the 3-part footer
flops -
All three parts become left justified. When I point my browser to the
original page: http://www.xs4all.nl/~sbpoley/webmatters/, the layout of
the
footer is as expected.

Can anyone help me figure out what I'm missing here? (The auxiliary
files
under Web Matters - Main Page_files/ were also saved and I verified that
they
were read when the main page loaded.)

You need the CSS files too. The CSS file that handles the positioning is
http://www.xs4all.nl/~sbpoley/extrastyles.css and the other one is
http://www.xs4all.nl/~sbpoley/basic.css . You find these filenames in the
head of the HTML document.
Jul 20 '05 #10

P: n/a
Quoth the raven named Jim Cochrane:
I just google-searched this group and could not find any references to
this. I'm trying to figure out how to specify a three-part header with
html. For example,

left part center part right part


http://home.rochester.rr.com/bshagnasty/banner.html

--
-bts
-This space intentionally left blank.
Jul 20 '05 #11

P: n/a
In article <dy*******************@twister.nyroc.rr.com>, Beauregard T. Shagnasty wrote:
Quoth the raven named Jim Cochrane:
I just google-searched this group and could not find any references to
this. I'm trying to figure out how to specify a three-part header with
html. For example,

left part center part right part


http://home.rochester.rr.com/bshagnasty/banner.html


That's great - thanks! The item in the center ends up higher than the
others (which, being a non-expert in html and css, I could not find a
reason for), but adding a <br> for the center item seems to fix this
adequatley for my purposes.

Someone else responded that floats might provide a solution and I think
this is an example of what he meant. But I wasn't knowledgeable enough
(or didn't have enough think time) to figure it out from the link he gave.
So it helps a lot to have found this example.

Thanks again.
--
Jim Cochrane; jt*@dimensional.com
[When responding by email, include the term non-spam in the subject line to
get through my spam filter.]
Jul 20 '05 #12

P: n/a
Thanks very much to everyone who responded to my question. You guys have
been very helpful.

In article <kr*****************************@newszilla.xs4all. nl>, Kris wrote:
In article <sl****************@shell.dimensional.com>,
Jim Cochrane <jt*@shell.dimensional.com> wrote:
I just google-searched this group and could not find any references to
this. I'm trying to figure out how to specify a three-part header with
html. For example,

left part center part right part


Steal it. <http://www.heddes.nl/>

--
Jim Cochrane; jt*@dimensional.com
[When responding by email, include the term non-spam in the subject line to
get through my spam filter.]
Jul 20 '05 #13

This discussion thread is closed

Replies have been disabled for this discussion.