473,721 Members | 2,103 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

layoutgala and not happy (crosspost from CSS)

Hi,

I'm trying to make a two column site - or to be precise - a part of a
corporate intranet site.
I want to make this part in css, so that in the future, my part can be
reused and function properly. So no hacks or anything thats not quite
kosher.
What do I want: I want two columns, where the left one should have a
fixed width, and variable height, while the right one should have
relative width (down to a minimum size hopefully) width a variable
height.
Something like this:
http://blog.html.it/layoutgala/LayoutGala24.html
As you may see, this works quite well in Firefox and opera, but not so
good in IE (just resize the window). And I want to make IE renders this

page like Firefox.. the company policy is to suport IE, and not the
rest, but I want to make it crossbrowser compatible.
Any ideas? I have the sameproblem, but width a different stylesheet,
its mainly the wrapping of the float thats a problem.

Apr 5 '06 #1
7 1873
In article <11************ **********@u72g 2000cwu.googleg roups.com>,
Trashcan <la*****@gmail. com> wrote:
What do I want: I want two columns, where the left one should have a
fixed width, and variable height, while the right one should have
relative width (down to a minimum size hopefully) width a variable
height.
See here for a bare-bones example that also works in Netscape 4:

http://realworldstyle.com/2col.html

Be sure to notice that the right column has the following thingy
inside the end of the div block:

<div class="spacer"> &nbsp;</div>

.... where "spacer" contains a clear:both. This forces both columns
to be the same height and forces the footer to start where the
columns end.

The only change I'd make to this example would be to express the
width of the left column, and the left margin of the right column,
in ems rather than pixels.
As you may see, this works quite well in Firefox and opera, but not so
good in IE (just resize the window).


The example above works fine in all the browsers I tested (Opera,
Firefox, IE).

-A
Apr 5 '06 #2
axlq wrote:

See here for a bare-bones example that also works in Netscape 4:


Does anybody really care if something works in Netscape 4 any more? I
think the 3 people in the world who might still be using it are probably
already accustomed to browsing with CSS disabled, dontcha think?

--
Reply email address is a bottomless spam bucket.
Please reply to the group so everyone can share.
Apr 6 '06 #3
In article <49************ @individual.net >, kchayka <us****@c-net.us> wrote:
axlq wrote:

See here for a bare-bones example that also works in Netscape 4:
Does anybody really care if something works in Netscape 4 any more?


Yes.
I think the 3 people in the world who might still be using it are
probably already accustomed to browsing with CSS disabled, dontcha
think?


Ah, but it's nice to know that a simple attribute
"margin-left: -1px;" will allow NS4 to work well with a 2-column CSS
layout without breaking other browsers. It's an easy fix, adds only
20 bytes to a CSS definition, so why not add it in case some other
browser crops up with the same bug?

-A
Apr 6 '06 #4
ok axlq, I tried the link you gave me, and it works fine in FF and
Opera, but not IE ver 6, it still wraps the text down when you downsize
the window towards the left column. The only solution I've seen for IE
is through a hack like this -
(http://bluerobot.com/web/layouts/layout1.html) - but I do not want to
use hacks.

The only solution I can think of is to use the min-width property and
hope that next IE will support that. I want something like this
(http://portal.opera.com/startup/ - viewed in Opera, it even scales
down the picture!) I don't need the picture scaling, but I want
something like the first link without any hacks.

any ideas - i've searched high and low - doesn't seem like its
possible....?

Apr 7 '06 #5
In article <11************ **********@i40g 2000cwc.googleg roups.com>,
Trashcan <la*****@gmail. com> wrote:
ok axlq, I tried the link you gave me, and it works fine in FF and
Opera, but not IE ver 6, it still wraps the text down when you downsize
the window towards the left column.
Perhaps I don't understand what you're seeing. You initially wrote:

I want two columns, where the left one should have a fixed
width, and variable height, while the right one should have
relative width (down to a minimum size hopefully) width a
variable height.

The link you gave, http://blog.html.it/layoutgala/LayoutGala24.html
works identically for me in Opera, Firefox, and IE6. What behavior in
IE6 are you seeing that's different?

I provided a similar link, http://realworldstyle.com/2col.html which
also behaves identically for me in Opera, Firefox, and IE6, as well
as Netscape 4.
The only solution I've seen for IE is through a hack like this -
(http://bluerobot.com/web/layouts/layout1.html) - but I do not want
to use hacks.
I don't blame you, and I'd want to avoid position:absolu te if possible
too.

Please state what, exactly, you are trying to achieve. I cannot see
any difference in behavior between Opera, IE6, and Firefox for the
example pages both you and I presented. Perhaps if you provide a
link to a screenshot showing what you're seeing wrong, would help.
The only solution I can think of is to use the min-width property and
hope that next IE will support that. I want something like this
(http://portal.opera.com/startup/ - viewed in Opera, it even scales
down the picture!) I don't need the picture scaling, but I want
something like the first link without any hacks.


Now THAT page doesn't work in IE6. It's fixed width and un-scalable
in IE6, but not Opera or Firefox. That wouldn't be what I want for
a web page. The picture scaling is interesting though. It even
works in Firefox.

-A
Apr 7 '06 #6
Trashcan wrote:
The only solution I've seen for IE
is through a hack like this -
(http://bluerobot.com/web/layouts/layout1.html) - but I do not want to
use hacks.
Without looking at that example in too much detail, I will guess that
the main reason they use so many hacks is because of all those px-sized
elements. That layout has absolutely no need for pixel precision.

Drop all the hacks, change all font sizes to % units, and change widths
and such to either % (of window) or em (that adjust with text size). I
bet the layout will work just fine, in just about any browser you use.

BTW, I did notice a "be nice to Opera 5" hack in the CSS. Opera 5 is
ancient history now. I wouldn't bother with anything that old.
The only solution I can think of is to use the min-width property and
hope that next IE will support that.


The latest IE7 beta does seem to support min/max-width. About time! ;)

--
Reply email address is a bottomless spam bucket.
Please reply to the group so everyone can share.
Apr 7 '06 #7
ok, sorry for the late reply, but in my defense, I blame easter..:)

Two screenshots from IE:
http://www.axehigh.com/pictures/406forum1.gif
http://www.axehigh.com/pictures/407forum2.gif

As you can see, when you minimize the width of ie, somehing funky
happens. What I want is for the effect you are wathcing not to happen.
Most pages I've seen that uses percentages or relative positioning in
some form have this problem. Even google groups has it, just drag it
down to a small width, and watch all those ads on the right hand side
cramp up the style.

kchayka - I'll try to do what you said with that "be nice to opera5"
version, and convert it to the proper syntax, ie kill all hacks and
switch to em and %. I'll see where that brings me.

Thanks!

Apr 18 '06 #8

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

11
1165
by: anon | last post by:
Dear Microsoft: In your new ASP.NET 2.0 page model of being able to crosspost to another page, it would seem that if you were to type that word in Google, "crosspost" or "cross post", you will get endless amount of results from the newsgroup police complaining about posters cross posting to many newsgroups as this very message is doing. So to those at Microsoft, and since posting your form results to another page is very very...
1
1562
by: Viken Karaguesian | last post by:
Hello to all, Just wanted to wish everyone on these groups a happy and prosperous New Year. You have all been a helping hand for me whenever I've had questions, even those who occasionally flamed me :>) Partially because of the helpful hands here, I've been able to convert my personal site to a framless and table-less design, which passes strict validation for HTML and for CSS.
9
1352
by: DL | last post by:
Hi, I'm not entirely sure if it's an HTML question or CSS one (so I've also posted it to the HTML ng as well). Case here: <table> <tr><td bgcolor="black">bla bla</td<td>something else</td></tr> <tr><td bgcolor="black">bla bla row 2</td<td>something else 2</td></ tr> <tr><td bgcolor="black">bla bla row 3</td<td>something else 3</td></
0
8853
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, weíll explore What is ONU, What Is Router, ONU & Routerís main usage, and What is the difference between ONU and Router. Letís take a closer look ! Part I. Meaning of...
0
8736
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
0
9373
Oralloy
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. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
0
9228
jinu1996
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 captivates audiences and drives business growth. The Art of Business Website Design Your website is...
1
9146
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 most users, this new feature is actually very convenient. If you want to control the update process,...
0
9085
tracyyun
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 choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
0
5993
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
4762
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
3
2145
bsmnconsultancy
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 effective websites that not only look great but also perform exceptionally well. In this comprehensive...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.