I've got what I think is a fairly simple design aim: left column for
ul#navigation, rest of viewport for everything else (div#content,
copyright notice, address). Because ul#navigation comes after
div#content, I'm using position: absolute to place it in the left top
corner of the window, and margin-left on body element to provide the
space necessary.
I'd like to have a green background for the navigation, white on black
for everything else. To that end, I've set the height on #navigation
to 100%. It works on short pages. However, when one scrolls down on
long pages, the green background of the left column disappears.
< http://www.tsmchughs.com/ >
I'd appreciate any tips on extending the green down the entire page,
if such a thing is possible.
--
Brian
follow the directions in my address to email me 4 2265
Brian wrote: I've got what I think is a fairly simple design aim: left column for ul#navigation, rest of viewport for everything else (div#content, copyright notice, address). Because ul#navigation comes after div#content, I'm using position: absolute to place it in the left top corner of the window, and margin-left on body element to provide the space necessary.
I'd like to have a green background for the navigation, white on black for everything else. To that end, I've set the height on #navigation to 100%. It works on short pages.
hmmm - no it doesn't, well it does in Moz and opera but not in IE6, but of
course neither does position: fixed
However, when one scrolls down on long pages, the green background of the left column disappears.
< http://www.tsmchughs.com/ >
I'd appreciate any tips on extending the green down the entire page, if such a thing is possible.
Do you have any pages where the content will be 'shorter' than the
navigation in 'normal' browsing conditions? If not then make the body
background green and colour the content to suit.
or use a green background image on the body - sized to suit most 'normal'
variants
nice work ;o)
--
William Tasso - http://WilliamTasso.com
William Tasso wrote: Brian wrote:
design aim: left column for ul#navigation, rest of viewport for everything else I'm using position: absolute to place #navigation in the left top corner of the window, and margin-left on body element to provide the space necessary.
I'd like to have a green background for the navigation, white on black for everything else. To that end, I've set the height on #navigation to 100%. It works on short pages. hmmm - no it doesn't, well it does in Moz and opera but not in IE6
It doesn't work in IE6? How so? Is there something I didn't notice
that doesn't work?
but of course neither does position: fixed
Well, true. But I use a child selector so that IE gets absolute, and
Moz and Opera get fixed. The fixed #nav works really well. I'm quite
happy with it. But position: absolute means background color of the
left column is green only for the first screenful. < http://www.tsmchughs.com/ >
Do you have any pages where the content will be 'shorter' than the navigation in 'normal' browsing conditions?
Afraid so. The home page, for one.
or use a green background image on the body - sized to suit most 'normal' variants
and repeat-y, I suppose? That's a thought. Of course, it'd be nice
to have a fallback for someone who has image-loading turned off in
their graphical browser, but the image thing is at least something.
nice work ;o)
Why thank you. :)
--
Brian
follow the directions in my address to email me
William Tasso wrote: Brian wrote:
It doesn't work in IE6? How so? Is there something I didn't notice that doesn't work?
http://williamtasso.com/usenet/tsmchughs.jpg
Ah. Thanks for the screen capture. Interesting that IE5.0/Win seems
closer to Mozilla in this case (I tesed Mozilla using position:
absolute). Well, for longer pages, I don't see how IE6 is
significantly worse than 5/Win. I'm still thinking about how to make
this look a little nicer in the IE/win browsers.
--
Brian This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics |
by: Alex Bell |
last post by:
I'm in the very early stages of designing what I hope will be a two
column (menu+content) layout. I hope that the menu column will
remain fixed in other than MSIE browsers while the content column
changes depending on what menu item is called.
I've found several templates to look at, but none of them as far as I
can see gives examples of...
|
by: Eric |
last post by:
I would like to setup a two column layout for my web page using CSS.
I would like the Left column width to be auto.
Can I have the right column be offset by 8 pixels from the right edge of
the left column?
If so, how can I specify this?
--
|
by: Jerry |
last post by:
Hi Folks,
Ok, here's my story. I was asked to create a website
for the church I attend. I am a complete newbie to
creating websites. So, I did the usual -- did a bunch
of googling, found that using CSS saves time in the
long run, bought a couple books, googled more,
read online tutorials, read many posts in this
and other groups, etc.
|
by: kaeli |
last post by:
I have had a little free time lately to revisit a problem I have with the 3
column layout plus a header and footer.
See this example:
http://glish.com/css/7.asp
There is a header and 3 columns. Pretend there's a footer at the bottom, too.
:)
Here are the issues I have been unable to solve without tables _somewhere_
|
by: Daniel Déchelotte |
last post by:
Hi,
I would like to present one column, extending from the top to the bottom
of the viewport, with textured "drop-down shadow" and a textured
background. A bit like http://www.blogger.com/, but with textures
instead of solid colors and more importantly the column should adapt to
the viewport's width and to the default font size.
Here is...
| |
by: Edward |
last post by:
I'm pursuing the holy grail of creating a two-column CSS layout with
footer AND where the colors of the columns actually go all the way
down.
The code is below.
Here is a graphic of how it looks in each IE and FIREFOX:
http://www.tanguay.info/web/examples/twoColumnWithFooterFirefoxIeProblem.png
Does anyone have any idea what I might...
|
by: Sarita |
last post by:
Hello,
this might sound stupid, but I got a really nice homepage template
which unfortunately is a 3-Column Fixed Width CSS format. Now I don't
have any content for the right column and would like the middle column
just to use up that space instead.
Any way this is possible?
Thanks for your help, it is highly appreciated!
|
by: JWL |
last post by:
Hi all
I'm attempting to create a layout based on this one:
http://www.drugs.gov.uk/error404
After wading through that site's CSS (there's a lot of it), I extracted
the essence to the following:
http://www.sarroukhs.f2s.com/test/
|
by: Andy B |
last post by:
I am creating a CSS layout and need to test it with different browsers. I
have the framework for the layout done with contrasting colors for each
section. Can anybody if possible, go to
www.test.eternityrecords.org/index2.aspx and look at the design? Tested
browsers need to be Safari 3 +, IE5+ including IE8 and Firefox 2+. After you
go to the...
|
by: Oralloy |
last post by:
Hello folks,
I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>".
The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed.
This is as boiled down as I can make it. ...
|
by: jinu1996 |
last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that...
| |
by: Hystou |
last post by:
Overview:
Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For...
|
by: tracyyun |
last post by:
Dear forum friends,
With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the...
|
by: isladogs |
last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM).
In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules.
He will explain when you may want to use classes...
|
by: adsilva |
last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
|
by: 6302768590 |
last post by:
Hai team
i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
|
by: muto222 |
last post by:
How can i add a mobile payment intergratation into php mysql website.
| |
by: bsmnconsultancy |
last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating...
| |