Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > Footer?

Reply
Thread Tools

Footer?

 
 
Cerebral Believer
Guest
Posts: n/a
 
      03-25-2006
Hi all,

I would like to know how to get two rows of text links to appear at the
bottom of a page. Generally I have been using <div> tags with the id
attribute and CSS to place blocks of text, tables and images where I want
them to be, but this has got me a little stuck. My HTML code is:

<div id="footer" class="footer">
Home | About | Essays | Discussions | Member Area | Links & Resources |
Contact<p>
Text Only | Alternative Versions | Accessibility | Site Map | Help</div>

My CSS code is:

div#footer {
position : absolute;
left : 132.00pt;
bottom : 0pt;
width : 465.00pt;
align : center;
z-index : 2;
}

Problem is, that the text (lets call it the footer) I am controlling appears
over the top of some other text (actually text in a table) rather than right
at the bottom of the page vertically beneath the table. Also if I resize my
browser window, the "footer" also moves in relation to the bottom of the
browser window rather than staying in a fixed position at the bottom of my
page. The two rows of text I am trying to place at the bottom of my page
even occur as the last two lines of code in my HTML right before the </body>
and </html> tags. So what am I doing wrong here?

Regards,
C.B.


 
Reply With Quote
 
 
 
 
Neredbojias
Guest
Posts: n/a
 
      03-25-2006
With neither quill nor qualm, Cerebral Believer quothed:

> Hi all,
>
> I would like to know how to get two rows of text links to appear at the
> bottom of a page. Generally I have been using <div> tags with the id
> attribute and CSS to place blocks of text, tables and images where I want
> them to be, but this has got me a little stuck. My HTML code is:
>
> <div id="footer" class="footer">
> Home | About | Essays | Discussions | Member Area | Links & Resources |
> Contact<p>
> Text Only | Alternative Versions | Accessibility | Site Map | Help</div>
>
> My CSS code is:
>
> div#footer {
> position : absolute;
> left : 132.00pt;
> bottom : 0pt;
> width : 465.00pt;
> align : center;
> z-index : 2;
> }
>
> Problem is, that the text (lets call it the footer) I am controlling appears
> over the top of some other text (actually text in a table) rather than right
> at the bottom of the page vertically beneath the table. Also if I resize my
> browser window, the "footer" also moves in relation to the bottom of the
> browser window rather than staying in a fixed position at the bottom of my
> page. The two rows of text I am trying to place at the bottom of my page
> even occur as the last two lines of code in my HTML right before the </body>
> and </html> tags. So what am I doing wrong here?


It sounds like you want the "footer" _either_ at the bottom of the page
or at the bottom of the viewport, whichever is "lower". If you simply
want it at the bottom of the page, don't position it.

--
Neredbojias
Contrary to popular belief, it is believable.
 
Reply With Quote
 
 
 
 
Toby Inkster
Guest
Posts: n/a
 
      03-25-2006
Cerebral Believer wrote:

> So what am I doing wrong here?


1. You're using absolute positioning. (There are only a very few
situations when absolute positioning is needed, and if you use it,
you *really* need to know what you're doing.)

2. You're specifying lengths using points as a unit. (Points are
only really appropriate for print--and probably embossed--media.)

--
Toby A Inkster BSc (Hons) ARCS
Contact Me ~ http://tobyinkster.co.uk/contact

 
Reply With Quote
 
Cerebral Believer
Guest
Posts: n/a
 
      03-26-2006

"Neredbojias" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed)...
> With neither quill nor qualm, Cerebral Believer quothed:
>
>> Hi all,
>>
>> I would like to know how to get two rows of text links to appear at the
>> bottom of a page. Generally I have been using <div> tags with the id
>> attribute and CSS to place blocks of text, tables and images where I want
>> them to be, but this has got me a little stuck. My HTML code is:
>>
>> <div id="footer" class="footer">
>> Home | About | Essays | Discussions | Member Area | Links & Resources |
>> Contact<p>
>> Text Only | Alternative Versions | Accessibility | Site Map | Help</div>
>>
>> My CSS code is:
>>
>> div#footer {
>> position : absolute;
>> left : 132.00pt;
>> bottom : 0pt;
>> width : 465.00pt;
>> align : center;
>> z-index : 2;
>> }
>>
>> Problem is, that the text (lets call it the footer) I am controlling
>> appears
>> over the top of some other text (actually text in a table) rather than
>> right
>> at the bottom of the page vertically beneath the table. Also if I resize
>> my
>> browser window, the "footer" also moves in relation to the bottom of the
>> browser window rather than staying in a fixed position at the bottom of
>> my
>> page. The two rows of text I am trying to place at the bottom of my page
>> even occur as the last two lines of code in my HTML right before the
>> </body>
>> and </html> tags. So what am I doing wrong here?

>
> It sounds like you want the "footer" _either_ at the bottom of the page
> or at the bottom of the viewport, whichever is "lower". If you simply
> want it at the bottom of the page, don't position it.


Hi,

I tried the idea of not positioning it, and removed the <div> tags, this
made the footer shoot to the top of the page. Forgive my ignorance, I could
be way off base here, I am a learner, but if I remember what I read on the
w3org site correctly, if everything else is on a page is positioned using
<div> & stylesheets, and I have one item on the page which is not positioned
using the same methond, even though that item appears last in the HTML code,
will that item appear by default at the top of the page because the other
items are removed from the "document flow".

It really is my intention to control everything by <div> & CSS so that I can
adjust elements site-wide through simple changes in the relevant
stylesheets, rather than having to modify each page individually.

Regards,
C.B.


 
Reply With Quote
 
Cerebral Believer
Guest
Posts: n/a
 
      03-26-2006

"Toby Inkster" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed)5n.co.uk...
> Cerebral Believer wrote:
>
>> So what am I doing wrong here?

>
> 1. You're using absolute positioning. (There are only a very few
> situations when absolute positioning is needed, and if you use it,
> you *really* need to know what you're doing.)


I noticed that my other options were, Fixed | Relative | Static, I have
tried all of those, and sometimes the item ("footer") just dissapears
completely. What would you suggest is the best method of positioning seeing
as all my other page content is positioned using <div> & CSS.

> 2. You're specifying lengths using points as a unit. (Points are
> only really appropriate for print--and probably embossed--media.)


Do you know any point to pixel convertors?

Regards,
C.B.




 
Reply With Quote
 
Steve Pugh
Guest
Posts: n/a
 
      03-26-2006
"Cerebral Believer" <(E-Mail Removed)> wrote:
>
>"Toby Inkster" <(E-Mail Removed)> wrote in message
>news:(E-Mail Removed)5n.co.uk...


>> 2. You're specifying lengths using points as a unit. (Points are
>> only really appropriate for print--and probably embossed--media.)

>
>Do you know any point to pixel convertors?


Depends entirely on settings on the individual's user's computers.
However, for many users 1pt = 1 1/3 pixels. But if you are defining
text sizes or anything that is impacted by text sizes (e.g. line
heights, the heights of boxes containing text, etc.) then pixels are
an equally bad idea as points.

Steve
--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <(E-Mail Removed)> <http://steve.pugh.net/>
 
Reply With Quote
 
Neredbojias
Guest
Posts: n/a
 
      03-26-2006
With neither quill nor qualm, Cerebral Believer quothed:

>
> "Neredbojias" <(E-Mail Removed)> wrote in message
> news:(E-Mail Removed)...
> > With neither quill nor qualm, Cerebral Believer quothed:
> >
> >> Hi all,
> >>
> >> I would like to know how to get two rows of text links to appear at the
> >> bottom of a page. Generally I have been using <div> tags with the id
> >> attribute and CSS to place blocks of text, tables and images where I want
> >> them to be, but this has got me a little stuck. My HTML code is:
> >>
> >> <div id="footer" class="footer">
> >> Home | About | Essays | Discussions | Member Area | Links & Resources |
> >> Contact<p>
> >> Text Only | Alternative Versions | Accessibility | Site Map | Help</div>
> >>
> >> My CSS code is:
> >>
> >> div#footer {
> >> position : absolute;
> >> left : 132.00pt;
> >> bottom : 0pt;
> >> width : 465.00pt;
> >> align : center;
> >> z-index : 2;
> >> }
> >>
> >> Problem is, that the text (lets call it the footer) I am controlling
> >> appears
> >> over the top of some other text (actually text in a table) rather than
> >> right
> >> at the bottom of the page vertically beneath the table. Also if I resize
> >> my
> >> browser window, the "footer" also moves in relation to the bottom of the
> >> browser window rather than staying in a fixed position at the bottom of
> >> my
> >> page. The two rows of text I am trying to place at the bottom of my page
> >> even occur as the last two lines of code in my HTML right before the
> >> </body>
> >> and </html> tags. So what am I doing wrong here?

> >
> > It sounds like you want the "footer" _either_ at the bottom of the page
> > or at the bottom of the viewport, whichever is "lower". If you simply
> > want it at the bottom of the page, don't position it.

>
> Hi,
>
> I tried the idea of not positioning it, and removed the <div> tags, this
> made the footer shoot to the top of the page. Forgive my ignorance, I could
> be way off base here, I am a learner, but if I remember what I read on the
> w3org site correctly, if everything else is on a page is positioned using
> <div> & stylesheets, and I have one item on the page which is not positioned
> using the same methond, even though that item appears last in the HTML code,
> will that item appear by default at the top of the page because the other
> items are removed from the "document flow".


Yes, that is true with absolute or fixed positioning. However, I've
never seen a page where _everything_ in it was so positioned.

> It really is my intention to control everything by <div> & CSS so that I can
> adjust elements site-wide through simple changes in the relevant
> stylesheets, rather than having to modify each page individually.


You may want to rethink that strategy and, especially, make your page
more fluid or you'll probably run into more problems akin to the footer
one.

And as for the footer prob, perhaps you can put the footer container
inside the last/lowest of your other containers (which you said are all
positioned) and position it below the final other content.

--
Neredbojias
Contrary to popular belief, it is believable.
 
Reply With Quote
 
Carolyn Marenger
Guest
Posts: n/a
 
      03-26-2006
Cerebral Believer wrote:

>
> "Toby Inkster" <(E-Mail Removed)> wrote in message
> news:(E-Mail Removed)5n.co.uk...
>> Cerebral Believer wrote:


<snip>

> Do you know any point to pixel convertors?


Points are a unit of measure commonly used in the print industry. If I
remember correctly, 72 points equals one inch.

Pixels have to do with screen resolution, and their size varies monitor to
monitor. I seem to remember calibrating my monitor a few years ago and
having a pixel height and width of 1/83rd and 1/87th of an inch. That was
at 1024x768 resolution resolution, with the picture stretched to the edges
of my monitor. I now view at 1280x1024 on each of my two monitors, so my
pixels have shrunk by about 20%. On the other hand, I do occasionally
change my resolution to 800x600 just so I can view a site in a much smaller
viewport. At that point, my pixel size is about 20% larger.

In other words, converting point to pixels is about as easy as going for a
fifteen kilogram drive. You may be able to figure out the measurements
specific to your monitor and create the formula for your specific
situation, but it will only be a very rough guide for the rest of us.

Carolyn
--
Carolyn Marenger

 
Reply With Quote
 
Toby Inkster
Guest
Posts: n/a
 
      03-26-2006
Cerebral Believer wrote:

> I noticed that my other options were, Fixed | Relative | Static, I have
> tried all of those, and sometimes the item ("footer") just dissapears
> completely.


For the vast majority of things, static is what you want. Relative can be
handy *occasionally*.

You can then use the natural flow of HTML, combined with "float" for most
positioning purposes.

--
Toby A Inkster BSc (Hons) ARCS
Contact Me ~ http://tobyinkster.co.uk/contact

 
Reply With Quote
 
Jim Moe
Guest
Posts: n/a
 
      03-26-2006
Cerebral Believer wrote:
>>
>>> So what am I doing wrong here?

>>
>> 1. You're using absolute positioning. (There are only a very few
>> situations when absolute positioning is needed, and if you use it,
>> you *really* need to know what you're doing.)

>
> I noticed that my other options were, Fixed | Relative | Static, I have
> tried all of those, and sometimes the item ("footer") just dissapears
> completely. What would you suggest is the best method of positioning seeing
> as all my other page content is positioned using <div> & CSS.
>

Without an URL showing your test case it is hard to give useful suggestions.

>> 2. You're specifying lengths using points as a unit. (Points are
>> only really appropriate for print--and probably embossed--media.)

>
> Do you know any point to pixel convertors?
>

ROTFL!
Use % for font sizes, and specifically 100% for the main content font size.
Use EMs for spacing around text.
This way your site adapts to the visitor's preferences, settings and
equipment.


--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off




Advertisments