http://coffeeonmars.com/testing/17NewIndex.html
might not be perfect code, but I believe it addresses many of the
issues several of you commented on.
*Many* thanks for the generous help. I hope to be able to evolve this
thing to meet my design goals.
Now, time for a beer.
J
On 26/07/2011 9:06 AM, John wrote:
On Jul 22, 2011, at 7:17 AM, Alan Gresley wrote:
Delete the whole declaration block of _body:after_ and amend these two
style blocks.
.livebar {
width: 770px;
min-height: 100%;
overflow: auto;
margin: 0px auto;
background-color: #626862;
}
* html .livebar {
On Jul 22, 2011, at 7:17 AM, Alan Gresley wrote:
Delete the whole declaration block of _body:after_ and amend these
two style blocks.
.livebar {
width: 770px;
min-height: 100%;
overflow: auto;
margin: 0px auto;
background-color: #626862;
}
* html .livebar {
height: 1%; /* For
On 22/07/2011 2:34 PM, Ghodmode wrote:
On Fri, Jul 22, 2011 at 4:02 AM, G.Sørtungunla...@c2i.net wrote:
On 21.07.2011 20:30, John wrote:
Well, I am getting closer to tackling this issue, yet my playing with
values in the below body:after code didn't fix the issue which can be seen
in the
On Fri, Jul 22, 2011 at 10:17 PM, Alan Gresley a...@css-class.com wrote:
...
The layout should work in all browsers consistently. BTW, the below comment
is not quite true.
/* Margins are handled inconsistently on different
* browsers. Since this object is absolutely positioned
*
Thanks for all the help Georg, Alan and Ghodmode...
in a way, it's good to know that part of my woes were due to sloppy
coding and tags...
John
On Jul 21, 2011, at 9:34 PM, Ghodmode wrote:
On Fri, Jul 22, 2011 at 4:02 AM, G.Sørtun gunla...@c2i.net wrote:
On 21.07.2011 20:30, John
Well, I am getting closer to tackling this issue, yet my playing with
values in the below body:after code didn't fix the issue which can be
seen in the screengrab here:
http://www.coffeeonmars.com/afterResults.jpg
for lack of better terms, it looks like it wants to behave itself,
but I
On 21.07.2011 20:30, John wrote:
Well, I am getting closer to tackling this issue, yet my playing with
values in the below body:after code didn't fix the issue which can be
seen in the screengrab here:
http://www.coffeeonmars.com/afterResults.jpg
Have more or less lost track of what you're
Ah-hah!
fooling around more seems to have paid off...I re-visited your value
for margin-left, noticing that it was off by about as wide as my left-
hand menu, so I began adding values, subtracting 3 for...I'm not
sure...I'll need to track down those 3 pixels.
At any rate, that column
On Jul 21, 2011, at 1:02 PM, G.Sørtun wrote:
Have more or less lost track of what you're trying to achieve, but
maybe this is close enough...
http://www.gunlaug.no/tos/alien/j/john.html
http://www.gunlaug.no/tos/alien/j/john_files/styles00.css
regards
Georg
thank you, Georg;
On 21.07.2011 22:15, John wrote:
what I need to do is make the center, darker area visually go the
the bottom of the browser window no matter how short or tall it
is,
I see.
Reload...
http://www.gunlaug.no/tos/alien/j/john.html
http://www.gunlaug.no/tos/alien/j/john_files/styles00.css
You're mixing floats and absolute positioning on major element, which
can't work in such a layout.
The mix of 'em' and 'px' for margins and width also doesn't work well in
such layouts.
So, reload again...
http://www.gunlaug.no/tos/alien/j/john.html
On Fri, Jul 22, 2011 at 4:02 AM, G.Sørtun gunla...@c2i.net wrote:
On 21.07.2011 20:30, John wrote:
Well, I am getting closer to tackling this issue, yet my playing with
values in the below body:after code didn't fix the issue which can be seen
in the screengrab here:
Ghodmode;
would you please clarify what you have below as body:after
Is this a different tag I'd be applying?
thanks!
John
On Jul 14, 2011, at 1:34 PM, Ghodmode wrote:
Approach the problem differently. You want a differently colored
background to your content, right? Try adding some
PM
To: css-d@lists.css-discuss.org
Subject: Re: [css-d] 100% height issue, and graphic placement q's
Ghodmode;
would you please clarify what you have below as body:after
Is this a different tag I'd be applying?
thanks!
John
would you please clarify what you have below as body:after
This is what's known as CSS Generated Content. A Google search will
turn up details and other examples
Is this a different tag I'd be applying?
Not exactly. Basically, it's a way to add stuff to a page with CSS
(and without adding
There is something I'm not getting about appliying/implementing this.
I've read a couple of links discussing it, and I see how you can
manipulate text in a number of useful ways..
but I don't get how I can make my center (content) column go as far,
visually as the browser window is open,
On Jul 13, 2011, at 10:48 PM, Philippe Wittenbergh wrote:
On Jul 14, 2011, at 4:42 AM, John wrote:
1. Why does the center area not go to the bottom? I put in height:
100%; for both the body of the document and for that center area.
If the idea is that div.livebar stretches from top to
On Wed, Jul 20, 2011 at 4:57 AM, John j...@coffeeonmars.com wrote:
Ghodmode;
would you please clarify what you have below as body:after
http://www.w3.org/TR/CSS21/generate.html#before-after-content
http://w3schools.com/cssref/sel_after.asp
Is this a different tag I'd be applying?
That's
On Wed, Jul 20, 2011 at 5:51 AM, John j...@coffeeonmars.com wrote:
There is something I'm not getting about appliying/implementing this. I've
read a couple of links discussing it, and I see how you can manipulate text
in a number of useful ways..
It creates new content in your page without it
On Wed, Jul 20, 2011 at 6:53 AM, John j...@coffeeonmars.com wrote:
After reading this email and the links suggested, something isn't adding up
in my head. I think I get what's being said, I think I've typed the right
code, but I don't see the right behavior.
If I'm getting inheritence, then
On Jul 13, 2011, at 3:09 PM, Ghodmode wrote:
something about that sounds familiar...do I need to add something
like
overflow: notvisible;
overflow: hidden;
or you can play with overflow:scroll on certain elements, but that has
lead to weird scrolling for me in the past.
Hello;
I have two questions about this page: http://www.coffeeonmars.com/
page.html
1. Why does the center area not go to the bottom? I put in height:
100%; for both the body of the document and for that center area.
I noticed while viewing the page at 1024 x 768 that when the browser
On Thu, Jul 14, 2011 at 3:42 AM, John j...@coffeeonmars.com wrote:
Hello;
I have two questions about this page: http://www.coffeeonmars.com/page.html
1. Why does the center area not go to the bottom? I put in height:100%; for
both the body of the document and for that center area.
I
On Jul 13, 2011, at 2:32 PM, Ghodmode wrote:
I think that 100% height is based on the inner height of the
browser window.
So, they are actually going to the bottom of that. However, the
overflow is
defaulting to visible, so the content becomes longer than the
element that
contains it.
On Thu, Jul 14, 2011 at 5:50 AM, John j...@coffeeonmars.com wrote:
On Jul 13, 2011, at 2:32 PM, Ghodmode wrote:
I think that 100% height is based on the inner height of the browser
window.
So, they are actually going to the bottom of that. However, the overflow
is
defaulting to visible,
On Jul 14, 2011, at 4:42 AM, John wrote:
1. Why does the center area not go to the bottom? I put in height:100%; for
both the body of the document and for that center area.
If the idea is that div.livebar stretches from top to bottom of the /document/,
then you have to declare a min-height
Does anyone have any idea about this? Can I truly not create a table
that is 100% the height of the browser window? I've tried adding a min-
height to the table too but it doesn't seem to make any difference.
Help please!
On Aug 27, 2010, at 10:37 AM, Jody Levinson wrote:
Hello all,
I'm
Does anyone have any idea about this? Can I truly not create a table
that is 100% the height of the browser window? I've tried adding a
min- height to the table too but it doesn't seem to make any
difference.
I'm confused... What are you trying to do?
You have height=100% set on your table.
On Aug 30, 2010, at 11:19 AM, Climis, Tim wrote:
Does anyone have any idea about this? Can I truly not create a table
that is 100% the height of the browser window? I've tried adding a
min- height to the table too but it doesn't seem to make any
difference.
I'm confused... What are you
Hello all,
I'm trying to make this layout 100% the height of the browser window.
It uses a table for layout. I know there are other, perhaps
preferrable ways to do layouts than using a table, but I don't have
the option of changing that at this point.
Here's the page (one of several
I'm using this sticky footer method:
http://www.cssstickyfooter.com/
But my wrapper (outlined in red) isn't going to the bottom - can someone
point out my error(s)? This page validates as both XHTML strict and CSS.
My page:
http://www.redkitecreative.com/projects/mgwa/
--
Debbie C
Debbie Campbell wrote:
I'm using this sticky footer method:
http://www.cssstickyfooter.com/
But my wrapper (outlined in red) isn't going to the bottom - can
someone point out my error(s)? This page validates as both XHTML
strict and CSS.
My page:
Hi there,
html: http://aubreybenasa.com/height/
css: http://aubreybenasa.com/height/styles.css
I can't figure out how to make the the full background-image appear on this
page. When you open the page at a height less than the height of the
background image (810px) and use the scrollbar to page
Aubrey Benasa wrote:
Hi there,
html: http://aubreybenasa.com/height/
css: http://aubreybenasa.com/height/styles.css
I can't figure out how to make the the full background-image appear on this
page. When you open the page at a height less than the height of the
background image (810px) and
From: Aubrey Benasa aubreyben...@gmail.com
html: http://aubreybenasa.com/height/
css: http://aubreybenasa.com/height/styles.css
I can't figure out how to make the the full background-image appear on this
page. When you open the page at a height less than the height of the
background image
Seona Bellamy wrote:
Hi guys,
I need to create an absolutely positioned div that will float on top
of the existing page layout, and be 100% of the height of the rendered
page, not the viewport.
[..]
Cheers,
Seona.
Simply give the ancestor of the a.p. box position:relative which
2008/8/1 Alan Gresley [EMAIL PROTECTED]:
Seona Bellamy wrote:
I need to create an absolutely positioned div that will float on top
of the existing page layout, and be 100% of the height of the rendered
page, not the viewport.
Simply give the ancestor of the a.p. box position:relative which
Hi guys,
I need to create an absolutely positioned div that will float on top
of the existing page layout, and be 100% of the height of the rendered
page, not the viewport. Something similar to what Lightbox does -
greying out the page and displaying a box over it. The trouble is,
because it's to
From: Seona Bellamy [EMAIL PROTECTED]
Hi guys,
I need to create an absolutely positioned div that will float on top
of the existing page layout, and be 100% of the height of the rendered
page, not the viewport. Something similar to what Lightbox does -
greying out the page and displaying a
2008/7/31 Al Sparber [EMAIL PROTECTED]:
From: Seona Bellamy [EMAIL PROTECTED]
Is there a CSS way of doing this?
No - and the Lightbox scripted method is flawed to boot :-)
Our Lighshow widget would do exactly what you need to do and be accessible
if script is disabled. It's not free,
It was foretold that on 01/07/2008 @ 17:00:39 GMT-0400 (which was 18:00:39
where I
live) David Laakso would write:
Maybe Paul O'Brien's method might help?
http://www.pmob.co.uk/temp/2colfixedtest_4.htm
On Tue, 1 Jul 2008 23:53:36 -0300, Luc responded:
Good evening David,
That's a nice
Good afternoon David,
It was foretold that on 02/07/2008 @ 10:06:21 GMT-0700 (which was
14:06:21 where I live) David Hucklesby would write:
snipped a bit
FWIW - Paul's method does not put the footer at the bottom on my
(Win xp) version of Opera - 9.50 build 10063.
Strange... on my end
Good afternoon list,
I'm experimenting with 100% height and ran into some x-browser
inconsistencies (no surprise here).
Problems:
[1] IE seems to do the trick, except the footer overlaps a bit the
content.
[2] Opera, FF and Moz all have the same trouble: the header doesn't
sit
Luc wrote:
Good afternoon list,
I'm experimenting with 100% height and ran into some x-browser
inconsistencies (no surprise here).
Problems:
[1] IE seems to do the trick, except the footer overlaps a bit the
content.
[2] Opera, FF and Moz all have the same trouble: the header
Luc wrote:
Good afternoon list,
I'm experimenting with 100% height and ran into some x-browser
inconsistencies (no surprise here).
http://dzinelabs.com/sandbox/Height.html
Maybe Paul O'Brien's method might help?
http://www.pmob.co.uk/temp/2colfixedtest_4.htm
--
Good evening Bill,
It was foretold that on 01/07/2008 @ 16:46:09 GMT-0400 (which was
17:46:09 where I live) Bill Brown would write:
snipped a bit
I've tweaked your code a bit and published my results at:
http://theholiergrail.com/tests/height/index.html
Let me know if it helps!
Good evening David,
It was foretold that on 01/07/2008 @ 17:00:39 GMT-0400 (which was
18:00:39 where I live) David Laakso would write:
Maybe Paul O'Brien's method might help?
http://www.pmob.co.uk/temp/2colfixedtest_4.htm
That's a nice one too David, tnx!
--
Best regards,
Luc
Hi! I received a great tip from here a little while ago on how to make a
colum expand to 100% height. I'm now applying this to another design, but
I'd like about 10px padding on the bottom, no matter how high the column is
expanded.
Please see
On 5/16/07, Lee Powell [EMAIL PROTECTED] wrote:
Hi Georg
Unfortunately that doesn't seem to fix it when I test it in Safari or
Firefox on a mac...
Any other ideas?
From what I understand, this is correct behavior for height: 100%.
Setting height to 100% defines it to equal 100% of its
Lee Powell wrote:
Unfortunately that doesn't seem to fix it when I test it in Safari or
Firefox on a mac... Any other ideas?
Compare your fix with mine...
http://www.gunlaug.no/tos/alien/test_07_5060.html
...as mine works perfectly well in Firefox, Opera, Safari, IE7. Tested
relevant
Hi,
Wonder if anyone can shed a little light on this problem. I've
created a test page here:
http://www.sixtyten.co.uk/sandpit/testheight.html
Which includes a simple DIV with some content. HTML and BODY are set
to 100% height, as well as the DIV, however when previewing in
Firefox and
Lee Powell wrote:
http://www.sixtyten.co.uk/sandpit/testheight.html
When scrolling down the page it gets cut off!!
You're right: html and body, and subsequently the div, are taking height
from the window - regardless of how tall that is. The text will then
overflow the div. You must replace
Hi Georg
Unfortunately that doesn't seem to fix it when I test it in Safari or
Firefox on a mac...
Any other ideas?
Lee
On 15 May 2007, at 21:34, Gunlaug Sørtun wrote:
Georg
__
css-discuss [EMAIL PROTECTED]
Hi, I get the list in digest format so I hope this goes to the right place.
Rolf wrote:
I've been building this layout concept for a project that does
everything I want it to... almost. The basic markup is where I want
it to be, but I'm having one issue.
You can view it here:
I've been building this layout concept for a project that does
everything I want it to... almost. The basic markup is where I want
it to be, but I'm having one issue.
You can view it here: http://tinyurl.com/25r3pq
The layout is done via css, and there's a little javascript to open
and
I want to have a backround gradient across all page and also a background
image sits on the very bottom of the page (not viewport). I tryed something
like this:
html {
min-height: 100%;
background: url(...) repeat-x bottom blue; /* 1x1600px */
}
body{
height: 100%;
background: url(...) no-repeat
I've been trying to figure something out for a while now, and wouldn't
you know it, it's *just* dawned on me that I can pick your all's brains.
(Yeah, duh me!) This is just something I'm trying to do for the sake of
doing it - just to see if I *can* - it's not part of any actual design
or
http://css-discuss.incutio.com/?page=AnyColumnLongest has a good list of
related links; maybe it'll help. The padding/margin hack's not really all
that bad, but it does annoy me knowing it won't work if you have an
unreasonably enormous column (or just some anchors for that matter). ;-)
For the
-BEGIN PGP SIGNED MESSAGE-
Hash: SHA1
Andy Harrison wrote:
For the sticky footer, assuming it's actually possible, I'd think you'd want
to put everything in a wrapper div with min-height 100% (or gasp a
table). I've mulled this over myself a few times but haven't actually
played with
This is likely one of those Gordian knots of CSS: how to combine
percentages and ems in the same layout.
I want to style a block that fills the vertical space of the
viewport, minus the 2ems taken up by the header. How to express 100%
- 2em in CSS?
Before I fall back on JavaScript (or
Couldn't you use padding and negative margins?
div1 {height:100%; padding:2em 0 0 0;}
div2 {height:2em; margin:-2em 0 0 0;}
div id=div1
div id=div2/div
/div
David Merwin
[EMAIL PROTECTED]
541-335-1832
http://www.davemerwin.com
http://www.purebluedesign.com
http://www.betachurch.org
At 10/24/2006 12:22 PM, David Merwin wrote:
Couldn't you use padding and negative margins?
div1 {height:100%; padding:2em 0 0 0;}
div2 {height:2em; margin:-2em 0 0 0;}
div id=div1
div id=div2/div
/div
On Oct 24, 2006, at 11:55 AM, Paul Novitski wrote:
Paul Novitski wrote:
This is likely one of those Gordian knots of CSS: how to combine
percentages and ems in the same layout.
It can't be done, but that doesn't mean your _problem_ can't be solved
with regular CSS.
Some browsers may be a bit weak though - IE6 being one of them.
I want to
I am not getting it then. Sorry bout that. The flash object would be
controlled by the padding of the parent div. In this case the padding
then leaves room for the header div that is using negative top margin.
SOrry about that.
David Merwin
[EMAIL PROTECTED]
541-335-1832
Hi,
http://develop.oidadev.co.uk/arrogant_cat/frontend/basket_address.html
I am having problems on this example of a page created with 100% height
and 4 absolutely positioned divs with 100% height and background
colours.
The divs only take 100% height of the viewable area so when I
Try this
body {
margin: 0px;
padding: 0px;
}
// Sebastian
-Original Message-
From: richard hall [mailto:[EMAIL PROTECTED]
Sent: 25. maj 2006 15:56
To: Sebastian Dammark; css-d@lists.css-discuss.org
Subject: Re: [css-d] 100% height
Sebastian,
Thanks!
This worked
Is there any trick for getting a division to use 100% height in IE?
I tried height:100% and it works in FireFox and Safari, but not in IE.
... Richard
--
Richard H. Hall
http://www.umr.edu/~rhall
Save the internet - Preserve Network Neutrality!
http://www.savetheinternet.com
giving a link to your current page would greatly help. otherwise my
guess would be your doctype isn't getting making ie behave the way you
want.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
http://www.inspirationcenter.net/midamericadharma/100.aspx
Actually, I'm not sure what I did differently from the last time I tried,
but it doesn't seem to work in any of the browsers I tested.
The yellow background on the menu on the left is supposed to go to the
bottom of the page.
... Any
Hi Richard
Try this
html, body {
height: 100%;
}
// Sebastian
www.dammark.net
-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of richard hall
Sent: 24. maj 2006 21:02
To: cj
Cc: css-d@lists.css-discuss.org
Subject: Re: [css-d] 100% height
http
Hello All,
On my site, http://www.blueplasmarecordings.com/ I tried to achieve 100%
height. It works in Safari/Mozilla, but shocker, not in IE.
Anyone see why this wouldn¹t be working?
Sincerely,
Jordan WOLLMAN //
__
Hello all,
I recently launched my site: http://www.blueplasmarecordings.com/
Relevant CSS: http://www.blueplasmarecordings.com/assets/styles/global.css
The height thing again. Seems like this is a problem I can¹t seem to get
right! Any 404 page is a good example.
Works fine on the Mac FF and
Hi *Anastasios Angelidis,*
To standard browsers 100% height should be a real 100% height:
html, body, #heightestwrapper {height:100%;}
Your heightestwrapper should contain all the others.
Hope it helps,
Isabel Santos
On 9/26/05, Anastasios Angelidis [EMAIL PROTECTED] wrote:
Hi I mamanged to
Monday, September 26, 2005, 12:18:28 AM, Anastasios Angelidis wrote:
Hi I mamanged to get 100% working in explorer but not in Mozilla. Is
Google 100% height, 1st result will answer your question:
http://www.quirksmode.org/css/100percheight.html
The key in Standards mode:
html, body,
Hi I mamanged to get 100% working in explorer but not in Mozilla. Is
this something really supported in general?
You can see the example here: http://www.mamothblue.com
Thanks
__
css-discuss [EMAIL PROTECTED]
Hi everyone,
I'm trying to set-up a simple 2 column layout, with % widths and heights, so
that whichever column is longest, sets the height of the parent block.
Nav on the left, expands if content ( a ul with a number of li) increases.
Image on the right, with width as 100% and height at 100%
77 matches
Mail list logo
