Re: [css-d] I've got the IE blues...

2007-07-30 Thread John Lockerbie
I forgot to say, I've still got the problem with what I think is the
IE double margin problem which I can't seem to solve. It shows itself
in Win IE 5.1,5.5 and 6, but not 7. See Browsershots:
http://browsershots.org/website/http://catnaps.org/latest/saturday.html

Does anybody know what I've done wrong?

Regards
JL

On 29/07/07, John Lockerbie [EMAIL PROTECTED] wrote:
 On 29/07/07, David Laakso [EMAIL PROTECTED] wrote:
  John Lockerbie wrote:
   David,
  
   Thank you for the comments. I should have said it seems to be fine on
   Mac/Opera, as it does on Safari and Firefox, it's the Windows
   environments I've no access to.
  
   I'd not spotted the font size problem as I'm new to coding. This is my
   third attempt to redesign my site - see the problem in
   http://catnaps.org/islamic/islaurb.html - in order to reduce page
   lengths.
  
  
   JL
  
 
 
  The comments I made regarding Opera are when I veiwed it on a mac:
  Version
  9.21
  Build
  3678
  Platform
  MacOS X
  System
  10.4.9
 
  If page height is an issue could you split the pages or use js to open
  and close division sections.
 
  With regard to fonts, I am referring more to IE's inability to scale
  fonts when set in pixels, /regardless of page height,/ unless the user
  goes through the drill of putting the browser in accessiblity mode
  with the ignore font-sizes specified box checked.
 
  One way to avoid this is to set percent at user default (100%) on the
  body, and then use percent on individual selectors throughout the style
  sheet as needed (line-height is best specified as a raw number).
  For example:
  body {font: 100%/1.4 arial, helvetica, sans-serif;}
  h1 {font-size: 180%;}
  #footer p {font-size: 80%; line-height: 1.2;}
 
  Best,
 
  ~d
 
 
 
  --
  http://chelseacreekstudio.com/
 
 

 David,

 I looked at the page on Opera
 Version:  9.22
 Build:  3687
 MacOS X
 System: 10.4.10

 I work on Safari Version 2.0.4 (419.3) and check on Firefox 2.0.0.5. I
 don't have access to a Windows environment except at my local library
 where they've got the screens in the most bizarre arrangements you've
 ever seen and don't know how to change them.

 What I'm attempting to do is split the pages into a number of smaller
 pages, these being set out in the top and bottom menus - 'Menu for
 al-Salata...' - and it's that which is causing me the problems. I like
 the idea of using js to open divisions, but thought that might give
 visitors problems.

 50% of my visitors use WinIE6, 25% WinIE7, 15% Firefox and the rest a
 variety, so I'm really concerned to get the IE6 sorted out.

 I take your point about the font scaling issues and spent some time
 researching Zeldman et al to find a consensus. There isn't one. But I
 do worry about accessibility and will see what I can do about the
 fonts. I may sit in a darkened room and try to think the paging
 problem through again and see if I can find a simpler system.

 Anyhow, a lot to think about,

 With kind regards
 John

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] I've got the IE blues...

2007-07-30 Thread John Lockerbie
On 30/07/07, David Laakso [EMAIL PROTECTED] wrote:
 John Lockerbie wrote:
  I forgot to say, I've still got the problem with what I think is the
  IE double margin problem which I can't seem to solve. It shows itself
  in Win IE 5.1,5.5 and 6, but not 7. See Browsershots:
  http://browsershots.org/website/http://catnaps.org/latest/saturday.html
 
  Does anybody know what I've done wrong?
 
  Regards
  JL
 


 This is a mystery. You did not provide a url with this re-post. Using
 the url you provided yesterday [1] shows the page (s) rendering
 properly in IE7 through 5.01 (on XP) with no signs of the float drop
 seen in your screen capture. The page is rendering (from your question
 yesterday) as intended in win/Opera but not mac/Opera. Note that you
 have a series of markup validation errors  within a list around line 1482.


 [1]

 http://catnaps.org/islamic/islaurb.html

 Best,

 ~dL

 PS Fwiw, top-posting is making it impossible for anyone to follow this
 thread-- write below (rather than above) those you reply to on the list





Apologies for the top posting.

I'll check out the listing error.

The address for the problem float drop which occurs on Win IE 5.1,5.5
and 6 but not 7, is: http://catnaps.org/latest/saturday.html with css
file: http://catnaps.org/latest/latest.css

With kind regards
JL
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] I've got the IE blues...

2007-07-30 Thread David Laakso
John Lockerbie wrote:
 On 30/07/07, David Laakso [EMAIL PROTECTED] wrote:
   
 John Lockerbie wrote:
 
 I forgot to say, I've still got the problem with what I think is the
 IE double margin problem which I can't seem to solve. It shows itself
 in Win IE 5.1,5.5 and 6, but not 7. See Browsershots:
 http://browsershots.org/website/http://catnaps.org/latest/saturday.html

 Does anybody know what I've done wrong?

 Regards
 JL

   

 The address for the problem float drop which occurs on Win IE 5.1,5.5
 and 6 but not 7, is: http://catnaps.org/latest/saturday.html with css
 file: http://catnaps.org/latest/latest.css

 With kind regards
 JL

   


John,


If you can cope with not having cross-browser pixel perfection, the 
correction on a local file (without hacking) is to change the margin in 
#sidebar to read:
margin: 10px 0 10px 5px;

Others on the list may offer a better alternative.

Best,

~dL










-- 
http://chelseacreekstudio.com/

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] I've got the IE blues...

2007-07-30 Thread John Lockerbie
On 30/07/07, David Laakso [EMAIL PROTECTED] wrote:
 John Lockerbie wrote:
  On 30/07/07, David Laakso [EMAIL PROTECTED] wrote:
 
  John Lockerbie wrote:
 
  I forgot to say, I've still got the problem with what I think is the
  IE double margin problem which I can't seem to solve. It shows itself
  in Win IE 5.1,5.5 and 6, but not 7. See Browsershots:
  http://browsershots.org/website/http://catnaps.org/latest/saturday.html
 
  Does anybody know what I've done wrong?
 
  Regards
  JL
 
 
 
  The address for the problem float drop which occurs on Win IE 5.1,5.5
  and 6 but not 7, is: http://catnaps.org/latest/saturday.html with css
  file: http://catnaps.org/latest/latest.css
 
  With kind regards
  JL
 
 


 John,


 If you can cope with not having cross-browser pixel perfection, the
 correction on a local file (without hacking) is to change the margin in
 #sidebar to read:
 margin: 10px 0 10px 5px;

 Others on the list may offer a better alternative.

 Best,

 ~dL
 --
 http://chelseacreekstudio.com/

David,

I'll have a look at that suggestion though I would prefer to get a
more symmetrically arrangement if at all possible.

With kind regards
JL
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] I've got the IE blues...

2007-07-30 Thread Rick Faircloth
I prefer top-posting as well... scrolling down constantly is a pain...

Rick

-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of
[EMAIL PROTECTED]
Sent: Monday, July 30, 2007 7:32 AM
To: css-d@lists.css-discuss.org
Subject: Re: [css-d] I've got the IE blues...

John Lockerbie wrote:

 PS Fwiw, top-posting is making it impossible for anyone to follow 
 this thread-- write below (rather than above) those you reply to 
 on the list

That fad is your personal preference. Many of us dislike scrolling down
through long quotes to see whether the current posting has any content or is
of interest. Many of us prefer so-called top-posting or interleaved posting.

But I wouldn't presume to force either upon you.

Bruce


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] I've got the IE blues...

2007-07-30 Thread David Laakso
John Lockerbie wrote:
 On 30/07/07, David Laakso [EMAIL PROTECTED] wrote:
   
 John Lockerbie wrote:
 
 On 30/07/07, David Laakso [EMAIL PROTECTED] wrote:

   
 John Lockerbie wrote:

 
 I forgot to say, I've still got the problem with what I think is the
 IE double margin problem which I can't seem to solve. It shows itself
 in Win IE 5.1,5.5 and 6, but not 7. See Browsershots:
 http://browsershots.org/website/http://catnaps.org/latest/saturday.html

 Does anybody know what I've done wrong?

 Regards
 JL


   
 The address for the problem float drop which occurs on Win IE 5.1,5.5
 and 6 but not 7, is: http://catnaps.org/latest/saturday.html with css
 file: http://catnaps.org/latest/latest.css

 With kind regards
 JL


   
 John,


 If you can cope with not having cross-browser pixel perfection, the
 correction on a local file (without hacking) is to change the margin in
 #sidebar to read:
 margin: 10px 0 10px 5px;

 Others on the list may offer a better alternative.

 Best,

 ~dL
 --
 http://chelseacreekstudio.com/
 

 David,

 I'll have a look at that suggestion though I would prefer to get a
 more symmetrically arrangement if at all possible.

 With kind regards
 JL
   



John,

I experimented a little and have it closer in compliant browsers as well 
as IE7 through IE5.01 (did not check mac/ie5.2). It may not pass a 
micrometer test for cross browser pixel perfection but it is far better 
than it was.

Note that the file is now in quirks for IE6 and down, and that in 5,5 
and 5.01 the page is now centered. You'll want to validate. And I don't 
remember all that I changed. You'll need compare my styles with yours.

The uri is:
http://www.chelseacreekstudio.com/ca/cssd/arch.html

Best,
~dL

















-- 
http://chelseacreekstudio.com/

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] I've got the IE blues...

2007-07-30 Thread David Laakso


 
 David,

 Thank you very much for your time and effort. I'll take a close look
 at what you've done and see if I can then amend my site to suit.
 Incidentally, the site was always supposed to be centred.

 I've been trying to re-rationalise what I'm doing and simplify it but
 seem to be getting lost with all the different methods I'm trying.
 Isn't css fun...?

 With kind regards
 JL

   




John,

You are welcome and I hope it works out.

And, yes CSS is fun (particularly when you can find answers in the list 
archives that have not been messed up by folks who top post).

Best,

~dL








-- 
http://chelseacreekstudio.com/

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] I've got the IE blues...

2007-07-30 Thread Jim Nannery
Morning Bruce

You wrote

 John Lockerbie wrote:

 PS Fwiw, top-posting is making it impossible for anyone to follow
 this thread-- write below (rather than above) those you reply to
 on the list

 That fad is your personal preference. Many of us dislike scrolling down 
 through long quotes to see whether the current posting has any content or 
 is of interest. Many of us prefer so-called top-posting or interleaved 
 posting.

 But I wouldn't presume to force either upon you.

 Bruce



Not a fad and not someone's personal preference.

The following is from the list policies [1] Please note the second 
point.

a.. Trim your replies. If you have more quotation than original text, think 
about cutting down on the quoted stuff. The list members can look at the 
message to which you responded, or check the archive. Prune that quoted text 
with ruthless abandon. Everyone else will thank you for it, especially the 
list admin(s). Don't forget, thankful list admins are less hasty with the 
unsubscribe button.
a.. The list admin(s) will scowl heavily in the direction of any 
Jeopardy-style quotations-- ** that is, putting your answer before the 
quoted question to which you're responding ** -- but won't actually 
unsubscribe you for doing it. Unless you keep doing it without trimming down 
your quoted text (see above).  (emphasis added)

[1] http://www.css-discuss.org/policies.html

It might be worthwhile for list members to review them. After all, when 
we joined the list, we *all* agreed to abide by them..

Best to all

Jim Nannery
www.redfernenterprises.com




__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] font-size in body not inherited

2007-07-30 Thread Michael P. Soulier
On 7/29/07, Philippe Wittenbergh [EMAIL PROTECTED] wrote:

 That document is in Quirksmode. And the p are descendants of a table
 In that mode (also known as backwards compatibility mode),
 inheritance does not go _through_ table: table resets the font-
 size to 1em.

 If you use a DocType [1] that triggers Standards Mode, then the
 inheritance will work.

 [1] at a minimum:
 !DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01//EN

Right you are. Thank you. I'll make validation my next priority.

Mike
-- 
Michael P. Soulier [EMAIL PROTECTED]
Any intelligent fool can make things bigger and more complex... It takes a
touch of genius - and a lot of courage to move in the opposite direction.
--Albert Einstein
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] Expandable div's with rounded corners

2007-07-30 Thread Aaron Gray
 On Mon, 30 Jul 2007 02:39:08 +0100, Aaron Gray wrote:
 I have a three column example with expandable center column :-

 http://www.aarongray.org/Examples/CSS/ThreeColumnExample.html

 Is there any way to add modern rounded style corners to this ?

 I can see how to do it to the fixed width div's but not the header and 
 center div's.

 Many thanks in advance,

 You may get some ideas here:

 http://home.tiscali.nl/developerscorner/liquidcorners/liquidcorners.htm

Great, thanks alot that looks like it will do the job nicely.

Aaron


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


[css-d] IE 7 link bug?

2007-07-30 Thread Kevin Evans
Hello all,

A strange oddity here

When you scroll down on http://www.cwwebs.net/bc2007/ 
medical_negligence.html to the list (in content area) where it shows  
the list beginning with “cerebral palsy” and click on the link, then  
hit the back button in IE7 browser, then the next list item will be  
highlighted red as if you had just visited it instead of the link you  
actually clicked.

It doesn't happen in IE 6 and any other browser.

Any ideas and/or fixes?

Main CSS file: http://www.cwwebs.net/bc2007/css/styles.css

Thanks!

Kevin
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] Expandable div's with rounded corners

2007-07-30 Thread Aaron Gray
 On Mon, 30 Jul 2007 02:39:08 +0100, Aaron Gray wrote:
 I have a three column example with expandable center column :-

 http://www.aarongray.org/Examples/CSS/ThreeColumnExample.html

 Is there any way to add modern rounded style corners to this ?

 You may get some ideas here:

 http://home.tiscali.nl/developerscorner/liquidcorners/liquidcorners.htm

Can anyone solve this one :-

http://www.aarongray.org/Test/CSS/ThreeColumnRoundedCorners.html

On IE 6 the corners on the center div are not endering in the correct
places.

Looks and works fine on IE7 and FF.

Many thanks in advance,

Aaron

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] Expandable div's with rounded corners

2007-07-30 Thread Aaron Gray
 On Mon, 30 Jul 2007 02:39:08 +0100, Aaron Gray wrote:
 I have a three column example with expandable center column :-

 http://www.aarongray.org/Examples/CSS/ThreeColumnExample.html

 Is there any way to add modern rounded style corners to this ?

 You may get some ideas here:

 http://home.tiscali.nl/developerscorner/liquidcorners/liquidcorners.htm

Can anyone solve this one :-

http://www.aarongray.org/Test/CSS/ThreeColumnRoundedCorners.html

On IE 6 the corners on the center div are not endering in the correct
places.

Looks and works fine on IE7 and FF.

Many thanks in advance,

Aaron

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] collapsing vertical margins

2007-07-30 Thread Michael Leibson
- Original Message 
From: Gunlaug Sørtun [EMAIL PROTECTED]
To: Michael Leibson [EMAIL PROTECTED]
Cc: css-d@lists.css-discuss.org
Sent: Sunday, July 29, 2007 7:09:14 PM
Subject: Re: [css-d] collapsing vertical margins

(definitely! I can create a bigger and more complex mess _with_ CSS, 
than anyone could do before CSS... :-) )
The humour helps! ; - )

 I've also found (sigh) that IE6 suddenly ignores paragraph
 margin-right when that paragraph is absolutely positioned (it
 respects all other margins, however).  What is THAT all about??

One of IE6' many weak spots, and a good reason not to use A:P as a 
fix. A:P is useful for other purposes.

In your case I would reduce the styles/source code to something like...

http://www.gunlaug.no/tos/alien/test_07_5080.html

regards
 Georg

Thank-you for taking the time to do this, Georg -- I really appreciate it!

I've studied your code, and have saved it for future reference. Your comments 
show that you've used a 
number of specific hacks/workarounds (eg, the body's text-align: center for IE, 
the 
overflow: hidden used to [i think] subdue the 'hasLayout' in IE, etc).  I'd 
like to find 
explanations of both the hacks and the problems they undo, so that I can 
understand the 
principles, rather than simply imitate the code.  However, I'm new at all of 
this, and don't understand
many of the references and terminology I encounter along the way (eg, 
http://www.satzansatz.de/cssd/onhavinglayout.html, 
which Alan so kindly provided).
I've been studying Eric Meyer's CSS-Definitive Guide for three months now, but 
he doesn't even 
mention the hasLayout problem. (One would think that a detailed explanation of 
absolute positioning - 
which he furnishes - should include the rather important disclaimer that 
nothing else will work when using it in IE!
Some tried-and-true hacks/workaround to employ so that one can actually use the 
absolute positioning he
details would also seem fitting.)

Any suggestions as to where a beginner like me can find understandable 
explanations for the hacks and 
workarounds used for IE and the problems they address?

Thanks again!
- Michael








  Get news delivered with the All new Yahoo! Mail.  Enjoy RSS feeds right 
on your Mail page. Start today at http://mrd.mail.yahoo.com/try_beta?.intl=ca
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] Expandable div's with rounded corners

2007-07-30 Thread tedd
At 2:39 AM +0100 7/30/07, Aaron Gray wrote:
I have a three column example with expandable center column :-

 http://www.aarongray.org/Examples/CSS/ThreeColumnExample.html

Is there any way to add modern rounded style corners to this ?

I can see how to do it to the fixed width div's but not the header 
and center div's.

Many thanks in advance,

Aaron

Aaron:

You might want to consider this:

http://sperling.com/examples/box/

Cheers,

tedd
-- 
---
http://sperling.com  http://ancientstones.com  http://earthstones.com
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


[css-d] text-transform

2007-07-30 Thread Brian Cummiskey
Hi Guys,

I have a select drop down filled with color codes such as

PINK/BLUE

etc...

I want them to show up as
Pink/Blue

in the database that fills this list, they are stored in all CAPS, and 
are pulled directly with no formatting.

I applied the text-transform of capitalize to the element, but it 
doesn't seem to have any effect.  It seems like it can only capitalize 
from lowercase, and won't lowercase all but the first letter.

Before I go server-side and lcase() my array, I'm wondering if theres a 
better way with CSS.

I thought about something like:

#myselect { text-transform: lowercase; }
#myselect { text-transform: capitalize; }

which will first lowercase all the items, and then capitalize the words.

but this doesn't seem to work...  it still displays in full CAPS.



Any css ideas (cross browser (so none of those :after techniques)) 
before i go into the back end system?

Thanks!


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] Expandable div's with rounded corners

2007-07-30 Thread Aaron Gray
 At 2:39 AM +0100 7/30/07, Aaron Gray wrote:
I have a three column example with expandable center column :-

 http://www.aarongray.org/Examples/CSS/ThreeColumnExample.html

Is there any way to add modern rounded style corners to this ?

I can see how to do it to the fixed width div's but not the header 
and center div's.

Many thanks in advance,

Aaron
 
 Aaron:
 
 You might want to consider this:
 
 http://sperling.com/examples/box/

Tedd,

I will have a look at it, thanks,

Aaron

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


[css-d] effects of hasLayout (on one very discouraged student of CSS)

2007-07-30 Thread Michael Leibson
- Original Message 
From: Michael Leibson [EMAIL PROTECTED]
To: Alan Gresley [EMAIL PROTECTED]
Cc: css-d@lists.css-discuss.org
Sent: Sunday, July 29, 2007 3:21:08 PM
Subject: collapsing vertical margins

Michael Leibson wrote:

 . . . IE6 suddenly ignores paragraph margin-right when that paragraph is
 absolutely positioned (it respects all other margins,
 however).  What is THAT all about??

Alan Gresley responded:
 . . . Since you have a width set for your container, it has hasLayout (for IE 
 only), 
which causes the adjoining margins not to collapse. . . 
. . . Remember hasLayout only effects IE and when an elements gains hasLayout 
all types of undesired
effects are seen, please see

http://www.satzansatz.de/cssd/onhavinglayout.html

Reread this several times over a few weeks and all will eventually sink in.

Hi again, Alan (and anyone else interested in this topic);

I've been trying to understand the satzansatz article, as well as other 
articles to which it refers.
One of these is the article by Markus Mielke, of MS,  HasLayout Overview, 
at 
http://msdn.microsoft.com/library/default.asp?url=/library/en-us/IETechCol/cols/dnexpie/expie20050831.asp.

Among other things, that article seems to say that once a CSS property triggers 
IE's hasLayout, the affected
block element is given a new 'block formatting context', which I take to mean 
that -- in terms of some parameters,
like dimensions --  it no longer refers to those of its parent, but to those of 
some previous ancestor (eg, 
body, rather than containing div).  If so, this might be the explanation why 
the margins of my absolutely positioned p
didn't operate in relation to its containing div, but instead extended past 
that parent.  

Am I on the right track??

If I am, then it would seem to me that the most direct workaround/hack would be 
to somehow hide the
p's {position: absolute;} and the WIDTH, and every other CSS-provoked hasLayout 
trigger from IE, 
but not from all other browsers -- yet still somehow convey those directives to 
IE in a 'less offensive' manner.

Am I still headed in the right direction?

If so, could you (or anyone else interested in this topic) direct me to a site 
that not only gives such a hack,
but also explains it?

Thanks, in advance, for any insights you'd care to share!

- Michael
























  Ask a question on any topic and get answers from real people. Go to 
Yahoo! Answers and share what you know at http://ca.answers.yahoo.com





  Be smarter than spam. See how smart SpamGuard is at giving junk email the 
boot with the All-new Yahoo! Mail at http://mrd.mail.yahoo.com/try_beta?.intl=ca

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] collapsing vertical margins

2007-07-30 Thread Gunlaug Sørtun
 (definitely! I can create a bigger and more complex mess _with_ CSS, 
 than anyone could do before CSS... :-) )
 The humour helps! ; - )

Sometimes humor is all we can throw at weak and buggy browsers. The fact 
remains though: we can be much more creative with CSS than without it - 
even in IE/win.

 http://www.gunlaug.no/tos/alien/test_07_5080.html

 I've studied your code, and have saved it for future reference. Your comments 
 show that you've used a 
 number of specific hacks/workarounds (eg, the body's text-align: center for 
 IE, the 
 overflow: hidden used to [i think] subdue the 'hasLayout' in IE, etc).  I'd 
 like to find 
 explanations of both the hacks and the problems they undo, so that I can 
 understand the 
 principles, rather than simply imitate the code. 

I agree 100%. Copying without understanding how things work, is a recipe 
for failure.

The functionality of 'overflow: hidden' I use is described here...
http://www.w3.org/TR/CSS21/visuren.html#block-formatting
... and an understanding of how 'Block formatting contexts' works in 
standard compliant browsers will help in understanding how IE's 
non-standard 'Layout' works.

 However, I'm new at all of this, and don't understand
 many of the references and terminology I encounter along the way (eg, 
 http://www.satzansatz.de/cssd/onhavinglayout.html, 
 which Alan so kindly provided).

That's the only somewhat correct and complete article about IE's 
'hasLayout' bug you can find today, but designed bugs like that are 
always hard to describe in simple terms. That's true even for one who 
have a clear understanding of a particular bug in a particular browser, 
and can use that knowledge forwards and backwards and full circle. I 
know how hard such simplification is, since I'm one of the authors 
behind that 'hasLayout' article.

 I've been studying Eric Meyer's CSS-Definitive Guide for three months now, 
 but he doesn't even 
 mention the hasLayout problem. (One would think that a detailed explanation 
 of absolute positioning - 
 which he furnishes - should include the rather important disclaimer that 
 nothing else will work when using it in IE!
 Some tried-and-true hacks/workaround to employ so that one can actually use 
 the absolute positioning he
 details would also seem fitting.)

Haven't read the mentioned book (and probably never will), but I guess 
IE's Layout bug wasn't very well known/understood when Eric wrote it.
Also: I don't think a disclaimer would be of much use, and it would have 
to be conditioned.

IMO: the easiest workaround for problems with absolute positioning, is 
not to use A:P to lay out major parts of anything but very simple pages. 
  Absolute positioning is inherently inflexible because A:P elements are 
taken out of the flow, thus A:P is best reserved for shuffling minor 
document-parts around once the main parts are under control with some 
other layout method.
I still base most layouts on this method...
http://www.alistapart.com/articles/negativemargins/
...and add A:P and other methods on top of it when needed.

 Any suggestions as to where a beginner like me can find understandable 
 explanations for the hacks and 
 workarounds used for IE and the problems they address?

Look for CSS support first...
http://www.webdevout.net/browser-support-css?IE6=onIE7=onFX2=onOP9=onKN3_5=onSF2=onuas=CUSTOM
...so at least you can check what to expect across browser-land. IE6 and 
7 are well documented. No such list can ever be complete though, because 
some weaknesses/bugs will only show up for certain source-code/CSS 
combinations.

Next step should be to develop your own set of methods that you know 
will work in all major non-IE browsers, and not give in to IE's bugs and 
weaknesses. IE can almost always be beaten into submission once all 
other browsers are working well.
People here on [css-d] can help you find the right workarounds for IE as 
you go along, and let you know what to do in the rare cases when IE 
can't be fixed by CSS alone.

Thirdly: create lots of test pages - subject them to all options you can 
find in any browser you can lay your hands on - and break your own pages 
before letting any user (visitor) get a chance at breaking them. All web 
designs can be broken one way or another, but a good design should be 
able to take quite a bit without major failures.
Such an exercise will also help when it comes to understanding how 
visitors _may_ use their browsers, and you should know more about all 
major browsers than most visitors do if you want to create somewhat 
robust and reliable designs for/in those browsers.

regards
Georg
-- 
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] text-transform

2007-07-30 Thread Brian Cummiskey
SosCpdGMail wrote:
 Hello Brian

 Sorry, but I can't see if your question is how to retrieve uppercase text
 from database or apply pink/blue color to your selects.
Rafael,

Thanks, but I know how to do this and all the DB query behind it.  :)

The issue is that the functions I'm using to generate the selections are used 
elsewhere, and need the caps, so I'm trying to just style them appropriately on 
this one element before I go into the functions and make a case conditional for 
what page it's being called from.

My question was how to make it DISPLAY with CSS, if possible, in CamelCase.




__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


[css-d] font problem?

2007-07-30 Thread Luc
 Good afternoon list,

 I just encountered a strange phenomena (at least to me):

 resizing the text in Fireworks and Moz, breaks up my navigation
 (around increasing to 200% and up), while in Opera it holds up to
 1000% and in IE up to extra big.

 I tried setting the general font rule to 100% but that didn't solve
 it, tried setting the width of the #navcontainer to 9.5 ems but to no
 avail...

 What am i overlooking here?

 http://www.dzinelabs.com/projects/MPT/Pages/index.php

 http://www.dzinelabs.com/projects/MPT/Styles/MP.css
 
-- 
Best regards,
 Luc


Powered by The Bat! version 3.99.3 with Windows XP (build 2600),
version 5.1 Service Pack 2 and using the best browser: Opera.

My mother used to say: the older you get, the better you get -unless
you're a banana. - Rose, The Golden Girls.


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] font problem?

2007-07-30 Thread David Laakso
Luc wrote:
  Good afternoon list,

  I just encountered a strange phenomena (at least to me):

  resizing the text in Fireworks and Moz, breaks up my navigation
  (around increasing to 200% and up), while in Opera it holds up to
  1000% and in IE up to extra big.

  I tried setting the general font rule to 100% but that didn't solve
  it, tried setting the width of the #navcontainer to 9.5 ems but to no
  avail...

  What am i overlooking here?

  http://www.dzinelabs.com/projects/MPT/Pages/index.php

  http://www.dzinelabs.com/projects/MPT/Styles/MP.css
  
   


I have no idea what you are overlooking. Except maybe Opera handles 
stuff different. And something movable (type) on top of something static 
(an image) is problematic (except maybe in Opera, sometimes).

Did not try it, but...  try re-setting to 100% on the body, reducing the 
font-size on the nav (and repeating the image on the nav y-axis)?

body {
 font : 100% Verdana, Geneva, Arial, Helvetica, sans-serif; --- :: 
re-set from 76% to 100%
...
}

#navcontainer li {
font-size: 80%; ---:: declare
background: url(../Images/navbackground.gif) repeat-y 0 0.1em; ---:: 
declare repeat-y instead of no-repeat
...
}

Best,

~dL









-- 
http://chelseacreekstudio.com/

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


[css-d] font problem?

2007-07-30 Thread Luc
 Good afternoon list,

 I just encountered a strange phenomena (at least to me):

 resizing the text in Fireworks and Moz, breaks up my navigation
 (around increasing to 200% and up), while in Opera it holds up to
 1000% and in IE up to extra big.

 I tried setting the general font rule to 100% but that didn't solve
 it, tried setting the width of the #navcontainer to 9.5 ems but to no
 avail...

 What am i overlooking here?

 http://www.dzinelabs.com/projects/MPT/Pages/index.php

 http://www.dzinelabs.com/projects/MPT/Styles/MP.css
 
-- 
Best regards,
 Luc


Powered by The Bat! version 3.99.3 with Windows XP (build 2600),
version 5.1 Service Pack 2 and using the best browser: Opera.

My mother used to say: the older you get, the better you get -unless
you're a banana. - Rose, The Golden Girls.


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


[css-d] Same code different results

2007-07-30 Thread jana coyle
I have a container setup for placing orders, as seen in the following link.  
http://precisemessenger.com/private/orderbox.html
Notice line 1. has both radio buttons on the same line.  This is what I am 
looking for.

Unfortunately when I implement this container into my page, extra space is 
added and the radio buttons are on two lines.  Here is a link to see what I 
mean http://precisemessenger.com/private/placeorder.html

Please help me find what I am doing wrong.

Thank you,
Kevin
  
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] Same code different results

2007-07-30 Thread David Crossman
Text-align and margin-left are different for #orderhere. Is this intentional?

David
-=-




From: jana coyle
Sent: Mon 7/30/2007 10:40 PM
To: css-d@lists.css-discuss.org
Subject: [css-d] Same code different results


I have a container setup for placing orders, as seen in the following link.  
http://precisemessenger.com/private/orderbox.html
Notice line 1. has both radio buttons on the same line.  This is what I am 
looking for.

Unfortunately when I implement this container into my page, extra space is 
added and the radio buttons are on two lines.  Here is a link to see what I 
mean http://precisemessenger.com/private/placeorder.html

Please help me find what I am doing wrong.

Thank you,
Kevin
  
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] font problem?

2007-07-30 Thread Philippe Wittenbergh

On Jul 31, 2007, at 10:19 AM, Luc wrote:

  resizing the text in Fireworks and Moz, breaks up my navigation
  (around increasing to 200% and up), while in Opera it holds up to
  1000% and in IE up to extra big.

  I tried setting the general font rule to 100% but that didn't solve
  it, tried setting the width of the #navcontainer to 9.5 ems but to no
  avail...

  What am i overlooking here?

  http://www.dzinelabs.com/projects/MPT/Pages/index.php
In what sense is it breaking ?
I didn't see any difference between WebKit and Gecko.

You have a fixed width container (pixels), the side navigation column  
is also a fixed-width (pixels) box. When you zoom in, the box change  
size in Gecko and Webkit.
Opera uses a *page* zoom and scales everything, whereas Gecko and  
Safari have a *text* zoom, and only increase/decrease the size of the  
text.
If you set the width of your boxes in em, then they'll scale along  
with the text.

Philippe
---
Philippe Wittenbergh
http://emps.l-c-n.com




__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/