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

css and borders

P: n/a
I've got two classes header and footer. They both have a 2px. border
to make it appear as a box on top and at the bottom of the page. They
both have a standard width (respecting the padding property).
Now I wanted the footer to always apear on the bottom of the page even
if there's a blank page with only header and footer.
So I set it to position:absolute; bottom:12px; moving it to the
bottom. But now the width of the footer isn't the same anymore but
just as big as the text it contains.
To go round this I set it's width property to 100%. But now it only
respects padding on the left side and not on the right.
Any suggestions?
Jul 20 '05 #1
Share this Question
Share on Google+
5 Replies


P: n/a
> I've got two classes header and footer. They both have a 2px. border
to make it appear as a box on top and at the bottom of the page. They
both have a standard width (respecting the padding property).
Now I wanted the footer to always apear on the bottom of the page even
if there's a blank page with only header and footer.
So I set it to position:absolute; bottom:12px; moving it to the
bottom.
I didn't know you could do that! I'm not sure that is widely supported.
But now the width of the footer isn't the same anymore but
just as big as the text it contains.
To go round this I set it's width property to 100%. But now it only
respects padding on the left side and not on the right.
Well, it's now absolutely positioned. That's a different kind of animal,
that margins don't apply to. The browser is implying a left: 0px, absolutely
positioned divs are, well, absolutely positioned. You'll have to style the
contents of that div. Perhaps another div inside of it.

Jeff

Any suggestions?

Jul 20 '05 #2

P: n/a
In article Malfunction wrote:
I've got two classes header and footer. They both have a 2px. border
to make it appear as a box on top and at the bottom of the page. They
both have a standard width (respecting the padding property).
Now I wanted the footer to always apear on the bottom of the page even
if there's a blank page with only header and footer.
So I set it to position:absolute; bottom:12px; moving it to the
bottom. But now the width of the footer isn't the same anymore but
just as big as the text it contains.
To go round this I set it's width property to 100%. But now it only
respects padding on the left side and not on the right.
Any suggestions?


Use this:

right:0;

You are in wrong group, use ciwa.stylesheets for CSS questions. And
google it before.

Also see
http://steve.pugh.net/test/test57a.html

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Saapi lähettää meiliä, jos aihe ei liity ryhmään, tai on yksityinen
tjsp., mutta älä lähetä samaa viestiä meilitse ja ryhmään.

Jul 20 '05 #3

P: n/a
Sorry for being in the wrong group.
But right:0 doesn't do it. I want padding of 10 on either side. The
standard streches the box over the whole page until it reaches 10
pixel from the border.
Setting right:0 or 10 the box is aligned to the right but having only
the size of the containing text.

should look like this:

---------------------------------------------------
|...-------------------------------------------...|
|...| header with margin on both sides |...|
|...| but streched over the full remaining |...|
|...| width no matter how much text contained|...|
|...-------------------------------------------...|
|................................................. |
|................................................. |
|................................................. |
|................................................. |
|...-------------------------------------------...|
|...| should be the same as header but always |...|
|...| positioned to the bottom of the page |...|
|...-------------------------------------------...|
---------------------------------------------------
Lauri Raittila <la***@raittila.cjb.net> wrote in message news:<MP************************@news.cis.dfn.de>. ..
In article Malfunction wrote:
I've got two classes header and footer. They both have a 2px. border
to make it appear as a box on top and at the bottom of the page. They
both have a standard width (respecting the padding property).
Now I wanted the footer to always apear on the bottom of the page even
if there's a blank page with only header and footer.
So I set it to position:absolute; bottom:12px; moving it to the
bottom. But now the width of the footer isn't the same anymore but
just as big as the text it contains.
To go round this I set it's width property to 100%. But now it only
respects padding on the left side and not on the right.
Any suggestions?


Use this:

right:0;

You are in wrong group, use ciwa.stylesheets for CSS questions. And
google it before.

Also see
http://steve.pugh.net/test/test57a.html

Jul 20 '05 #4

P: n/a
On 12 Feb 2004 22:07:25 -0800, Malfunction <wl****@yahoo.de> wrote:
Sorry for being in the wrong group.
But right:0 doesn't do it. I want padding of 10 on either side.
10 ducks? 10 lira? 10 pins?
The
standard streches the box over the whole page until it reaches 10
pixel from the border.
Setting right:0 or 10 the box is aligned to the right but having only
the size of the containing text.

should look like this:


Should look like this:

width: 100%;
margin: 10px or 10em or whatever;
Jul 20 '05 #5

P: n/a
In article Neal wrote:
On 12 Feb 2004 22:07:25 -0800, Malfunction <wl****@yahoo.de> wrote:
The
standard streches the box over the whole page until it reaches 10
pixel from the border.
Setting right:0 or 10 the box is aligned to the right but having only
the size of the containing text.


Then use left:0 also.
width: 100%;
margin: 10px or 10em or whatever;


You never tested it, in standards mode? It causes horizontal scrolling,
or at least it should.

copy and f'ups set to ciwas.
--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Saapi lähettää meiliä, jos aihe ei liity ryhmään, tai on yksityinen
tjsp., mutta älä lähetä samaa viestiä meilitse ja ryhmään.

Jul 20 '05 #6

This discussion thread is closed

Replies have been disabled for this discussion.