Re: [css-d] Wierd IE 6 position: relative with ghosting

2007-03-09 Thread Ingo Chao
Subscriptions wrote:
 ... the ghosts make the page longer
 than it needs to be, creating visual issues.
 
 Would you mind looking at it? http://www.buckeyeinstitute.org/podcast/

I'd like to know if Safari and Opera are right to show the space that is 
occupied by the r.p. box before it is offset. Os is Fx right, not making 
the page longer?

Ingo

-- 
http://www.satzansatz.de/css.html
__
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] Holy Grail Layout - footer, padding and opacity issue

2007-03-09 Thread Philippe Wittenbergh

On Mar 9, 2007, at 4:27 PM, Richard Brown wrote:

 The site is here:
 http://www.stwinnowceschool.info/
 http://www.stwinnowceschool.info/wp-content/themes/school/style.css

 I have used their method for introducing a background colour but have
 removed the footer. I didn't need one in the design. Is this likely to
 cause any problems with any browsers please?
I don't think so, although I haven't checked in IE 6.

 Also I have told the calendar to only be 60% width of the right column
 but it doesn't seem to matter whether I put 10% or 90%. How do I make
 it shrink so it isn't touching the edge of the right column please?
Make the column larger ? The table for the calendar can't shrink much  
more, constrained by the contents. Remember, width for this kind of  
tables is always more like min-width. The table sill expand to fit  
the contents.

 And finally I have put an opacity in the right and left columns. What
 I didn't realise is that this would affect the text as well. Is there
 anyway of cancelling this out please?
No you can't; that is how opacity [1] works. It is applied to the  
whole box and the contents of the box.
Opacity is _not_ 'transparent background'.
What you want is rgba or hsla [2] for the background-colour -  
support: Safari 2.0 for rgba, future releases of Safari (3.0) and  
Gecko based browsers (FX 3.0) for rgba and hsla. Maybe Konqueror  
3.5.6, not sure.
Or use a semi-transparent background-image.

[1] http://www.w3.org/TR/css3-color/#transparency
[2] http://www.w3.org/TR/css3-color/#numerical

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/


Re: [css-d] aligning data in large tables

2007-03-09 Thread Jukka K. Korpela
On Fri, 9 Mar 2007, Philippe Wittenbergh wrote:

 td:first-child+td+td+td {text-align:right;} will select the 4th
 column in good browsers (including IE7).
 For IE 6, you need to use the col element.
 table
   colgroupcolcolcolcol class=alignRightcolcol/colgroup

 col.alignRight {text-align:right;}

 Note that you have to put the 2 selectors on separate lines, _not_
 grouping them, else IE 6 won't recognise anything.

I had some difficulties in understanding the last statement, but then I 
realized that you are warning against combining the two _rules_ into one,

td:first-child+td+td+td, col.alignRight {text-align:right;}

(The _line_ structure is irrelevant.)

Instead of col class=alignRight, I think you could just as well use 
the more direct col align=right, since that's what you mean, and 
you're doing this only to deal with compatibility issues, using a method 
that works on IE 6 (and other old browsers).

-- 
Jukka Yucca Korpela, http://www.cs.tut.fi/~jkorpela/

__
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] aligning data in large tables

2007-03-09 Thread Philippe Wittenbergh

On Mar 9, 2007, at 7:14 PM, Jukka K. Korpela wrote:

 On Fri, 9 Mar 2007, Philippe Wittenbergh wrote:

 td:first-child+td+td+td {text-align:right;} will select the 4th
 column in good browsers (including IE7).
 For IE 6, you need to use the col element.
 table
  colgroupcolcolcolcol class=alignRightcolcol/ 
 colgroup

 col.alignRight {text-align:right;}

 Note that you have to put the 2 selectors on separate lines, _not_
 grouping them, else IE 6 won't recognise anything.

 I had some difficulties in understanding the last statement, but  
 then I
 realized that you are warning against combining the two _rules_  
 into one,

 td:first-child+td+td+td, col.alignRight {text-align:right;}
Correct. Written like that IE 6 won't apply anything. It considers  
the first part invalid (+ unrecognised) and ignores the whole thing.  
According to CSS 2.1, 4.1.7, IE gets _that_ part of CSS 2.1 correctly.

 Instead of col class=alignRight, I think you could just as well  
 use
 the more direct col align=right, since that's what you mean, and
 you're doing this only to deal with compatibility issues, using a  
 method
 that works on IE 6 (and other old browsers).

I used a class, because one might eventually add other properties/ 
values.
I _was_ lazy while naming the class, though :p.

PS - in an ideal world I wouldn't use td:first-child+td+td+td, but  
td:nth-child(). Support is a bit weak atm.

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/


Re: [css-d] Wierd IE 6 position: relative with ghosting

2007-03-09 Thread Roger Roelofs
Ingo,

On Mar 9, 2007, at 3:49 AM, Ingo Chao wrote:

 Subscriptions wrote:
 ... the ghosts make the page longer
 than it needs to be, creating visual issues.

 Would you mind looking at it? http://www.buckeyeinstitute.org/ 
 podcast/

 I'd like to know if Safari and Opera are right to show the space  
 that is
 occupied by the r.p. box before it is offset. Os is Fx right, not  
 making
 the page longer?

The spec says When a box B is relatively positioned, the position of  
the following box is calculated as though B were not offset.   
http://www.w3.org/TR/CSS21/visuren.html#choose-position

However, I can't answer your question because I couldn't see any  
difference between Safari/Webkit and ff2.

My (possibly flawed) understanding of the spec is that the browser  
should show the space that would have been occupied by the r.p. box  
and show the content of the box offset as appropriate.  The browser  
should not shift following content due to the offset unless clearing  
floats would dictate otherwise.

hth

-- 
Roger Roelofs
Remember, if you’re headed in the wrong direction,
God allows U-turns!
  ~Allison Gappa Bottke

__
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 style in disabled text boxes ie

2007-03-09 Thread Ross Hulford
The font in disabled textboxes takes on a horrible grey indented look (ie) does 
anyone know the property and how to overwrite it?


R.



__
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 style in disabled text boxes ie

2007-03-09 Thread Ian Young
 To: css-d@lists.css-discuss.org
 Subject: [css-d] font style in disabled text boxes ie


 The font in disabled textboxes takes on a horrible grey indented
 look (ie) does anyone know the property and how to overwrite it?


Hi Ross

Not entirely sure what you mean here. Have an example?

Regards

Ian
--
No virus found in this outgoing message.
Checked by AVG Free Edition.
Version: 7.5.446 / Virus Database: 268.18.8/714 - Release Date: 08/03/2007
10:58

__
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] Wierd IE 6 position: relative with ghosting

2007-03-09 Thread Gunlaug Sørtun
Ingo Chao wrote:
 Subscriptions wrote:
 
 ... the ghosts make the page longer than it needs to be, creating 
 visual issues.
 
 Would you mind looking at it? 
 http://www.buckeyeinstitute.org/podcast/
 
 
 I'd like to know if Safari and Opera are right to show the space that
  is occupied by the r.p. box before it is offset. Os is Fx right, not
  making the page longer?

If my (old) interpretation of 'overflow: hidden' is correct, then Fx got
it wrong. I prefer Fx' way of doing it though :-)

As I see it:
- 'overflow: hidden' means hide overflowing part from view.
- 'overflow: hidden' does *not* mean treat overflowing part as if it
was subjected to 'display: none'.

My interpretation comes from the use of the word 'hidden' here. In
'visibility: hidden' the word 'hidden' means hidden objects aren't
visible but still take up space, so I've always thought it should mean
the same for 'overflow'.

However, it often makes more sense design-wise to treat overflowing
part as if it didn't exist - like Fx does, but we should then have had
an 'overflow: none' variant so we could choose.

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] FireFox CSS problem...

2007-03-09 Thread Michael Mistak
I have seen a similar issue where Firefox (or any Mozilla browser) won't
recognize a CSS file if it is served with the wrong MIME Type.

So first check that your server is serving .css files with the proper MIME
Type.

(seems unlikely, but I've come across servers that are configured improperly
for something this basic)

Mike

On 3/7/07, Matt Klein [EMAIL PROTECTED] wrote:

 Hi all -

 I have a web site that I just finished developing. During development, I
 had the website in a folder on my local computer with a sub-folder(css)
 for storing CSS files.

 I tested the site using both IE and FireFox and it displayed perfectly
 in both.

 My problem is that once I move it to my web server, IE still displays it
 just fine, but FireFox acts as though the CSS files don't exist. The
 content appears, but with the CSS files being applied.

 I even changed my references to the CSS files to be explicit paths
 instead of relative paths. Still IE is fine and FireFox doesn't seem to
 find the CSS files.

 I'm a little confused since it all worked fine when the site was on my
 local computer.Here's the link to the site www.sbcne.com/new


 Any ideas?


 Matt

 __
 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/




-- 
Michael W. Mistak

Patriotism is loving your country always and your government when it
deserves it -Mark Twain

If one would give me six lines written by the hand of the most honest man,
I would find something in them to have him hanged. - Cardinal Richelieu
__
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] Problems with custom image-bullets (IE of course)

2007-03-09 Thread Sarah McCall
I apologise in advance if I'm asking a stupid question, but I have a  
baby and not getting much sleep so brain not functioning well...!

I have been struggling to get custom bullets to line up correctly in  
IE. I searched the CSS archives and came across your example Francky at
http://home.tiscali.nl/developerscorner/css-discuss/test-graphical- 
bullets.htm.

This is very helpful and I think I understand how it works. The bit I  
don't understand is the IE fine-tuning. I've looked in the text  
books, but am still not sure how the IE browser reads this, but the  
other browsers don't. And fundamentally where do I put the:

!--[if lte IE 6]
style type=text/css
.container li { background-position: 0 .5em; } /* *** IE correction  
*** */
/style
![endif]--

Does it go in the HTML document  near the list itself?

Thanks in advance for your help.

Sincerely

Sarah 
__
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] Wierd IE 6 position: relative with ghosting

2007-03-09 Thread Peter Barney
Gunlaug Sørtun wrote:
 Subscriptions wrote:
 http://www.buckeyeinstitute.org/podcast/

 After loading the page, simply press CTRL-A and you'll see the ghost 
 rectangles on the left and on the bottom. They match up with the menu 
 div on the left and the content div on the bottom.

 Note that 'top: ?? / left: ??' on an element with 'position: relative'
 doesn't really move the element - it _offsets_ it visually from its
 original position _without removing_ its _space_ from the original
 position.

 If you don't want to leave any ghosts behind, then you may try
 _moving_ those elements with 'margin-top: ?? / margin-left: ??' instead,
 as 'margins' move the element _away from_ the original space - not just
 offset them visually.

 Using 'position: absolute' with 'top: ?? / left: ??' is another
 alternative that won't leave any ghosts.

Thank you! You taught me something valuable today. I usually avoid using 
position:, so I was not familiar with everything here.

The answer came from using your suggestion to you position: absolute, 
and once I realized that the containing block needed to be positioned 
relatively, everything snapped together.

So thank you, and how much do I owe you? ;-)

Peter
__
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] Wierd IE 6 position: relative with ghosting

2007-03-09 Thread Philippe Wittenbergh

On Mar 9, 2007, at 9:23 PM, Gunlaug Sørtun wrote:

 I'd like to know if Safari and Opera are right to show the space that
  is occupied by the r.p. box before it is offset. Os is Fx right, not
  making the page longer?

 If my (old) interpretation of 'overflow: hidden' is correct, then  
 Fx got
 it wrong. I prefer Fx' way of doing it though :-)

 As I see it:
 - 'overflow: hidden' means hide overflowing part from view.
 - 'overflow: hidden' does *not* mean treat overflowing part as if it
 was subjected to 'display: none'.

 My interpretation comes from the use of the word 'hidden' here. In
 'visibility: hidden' the word 'hidden' means hidden objects aren't
 visible but still take up space, so I've always thought it should  
 mean
 the same for 'overflow'.

 However, it often makes more sense design-wise to treat overflowing
 part as if it didn't exist - like Fx does, but we should then have  
 had
 an 'overflow: none' variant so we could choose.

[OK, now I see where the issue is.]

But the elements that are positioned relative and moved upwards on  
that page are not contained within blocks with overflow:hidden
Those elements trigger a scrollbar on body in Safari, iCab, Opera,  
but not in Gecko
Especially the div #entry, which is pulled upwards 365 px and has a  
height specified. Doesn't sound correct.

---
Anyway, on overflow:hidden:
 From CSS 2.1, 11.1.1 [1]
'This property specifies whether content of a block-level element is  
clipped when it overflows the element's box.'

'clipped' is the keyword. The part of the box that is hidden  
shouldn't take up any space anymore.
The overflow property (except 'visible') also establishes a new block  
formatting context (per 9.4.1), everything is contained within that box.

So a block within an overflow:hidden box that overflows that box  
should not take up any space nor affect the surrounding layout.

[1] http://www.w3.org/TR/CSS21/visufx.html#propdef-overflow
---

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/


Re: [css-d] a in li w/o padding-top -bottom: what is IE doing?

2007-03-09 Thread ~davidLaakso
Joel D Canfield wrote:
 http://streamliine.com/ii/bb/ looks as expected in FireFox, last two versions 
 of NN, and Opera.

 IE7 adds padding, methinks, to the text; IE6 blows up entirely and adds a 
 quart of margin. why?

 thanks muchly

 spinhead

   
Try completely revising your CSS to:
body {
 background-color: #fff; color: #000; font-size: 100%; margin: 0; 
padding: 0;  kill IE em font-scaling bug-- add percent on body
}
#navcontainer {
float:left; width: 130px;  set a width on the float
}
#navcontainer ul {
font: bold 0.7em/1.1 sans-serif;  set line-height for IE7.0
list-style: none;
padding: 0; margin: 0;  zero this stuff
}

#navcontainer a {
border-top:3px solid #ffceff;
border-right:4px solid #660066;
border-bottom:4px solid #660066;
border-left:3px solid #ffceff;
background-color: #bd07bd;
color: #ff;
padding-left: 5px;
text-decoration: none;
width: 100%;  kill the white space bug in IE6
}
#navcontainer a:hover {
border-top:3px solid #ffceff;
border-right:4px solid #660066;
border-bottom:4px solid #660066;
border-left:3px solid #ffceff;
background-color:#bd07bd;
color: #ffceff;
}
#navlist a {
display: block;
}
Quick tested (local) in XP :: IE7, IE6, Firefox/2.0.0.2, and Opera/9.10.

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] Margin Padding: Best Practices

2007-03-09 Thread Spellacy, Michael
 It's only us crazy web developers that ever compare one browser's
look with another's, after all.

Too true. :-)

Thanks. I think I have a better handle on it now thanks to you guys.

Spell

-Original Message-
From: David Hucklesby [mailto:[EMAIL PROTECTED] 
Sent: Thursday, March 08, 2007 9:17 PM
To: Spellacy, Michael; css-d@lists.css-discuss.org
Subject: Re: [css-d] Margin  Padding: Best Practices

On Wed, 7 Mar 2007 12:35:58 -0500, Spellacy, Michael wrote:
 Hi All,

 I was just wondering what the best practice is for handling default 
 user-agent margin and padding? For more control over my layout I 
 suppose I could set a universal selector to eliminate the default 
 stuff (* {margin: 0; padding: 0;))and then override it where I need to

 further on in the document, but killing those property values seems
instinctively wrong to me.

Me too. Since many elements don't have margins or padding, and those
that do generally need one or t'other, I have never quite seen the point
of that particular rule.

I suggest you follow the suggestions you already got, just setting
margins and padding where you need.

One possible problem with this universal reset is that some form
elements on some platforms can become non-functional or difficult to
use.

Personally, I don't worry too much about differences between browsers.
It's only us crazy web developers that ever compare one browser's look
with another's, after all.

Cordially,
David
--
www.hucklesby.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] Problems with custom image-bullets (IE of course)

2007-03-09 Thread Jukka K. Korpela
On Fri, 9 Mar 2007, Sarah McCall wrote:

 The bit I
 don't understand is the IE fine-tuning. I've looked in the text
 books, but am still not sure how the IE browser reads this, but the
 other browsers don't.

It's described e.g. at
http://www.quirksmode.org/css/condcom.html
but basically the idea is that !-- starts a comment in HTML and -- 
ends the comment, so browsers except IE ignore anything between them, 
whereas IE has been programmed to have some special processing of 
comments, including the recognition of [if...] constructs.

 And fundamentally where do I put the:

 !--[if lte IE 6]
   style type=text/css
   .container li { background-position: 0 .5em; } /* *** IE correction
 *** */
   /style
 ![endif]--

 Does it go in the HTML document  near the list itself?

It goes into the head part of your HTML document, in a place where a 
style element can appear. Technically this all depends on how IE 
processes the comment, but in practice it's best to put it in a place 
where it would belong if it were a style element. (In practice, browsers 
typically accept style elements outside the head element, but there's 
hardly any reason to rely on this.)

-- 
Jukka Yucca Korpela, http://www.cs.tut.fi/~jkorpela/

__
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] Firefox !important Image Print Style

2007-03-09 Thread L. Robinson
Dear List,

I've set img to display: none; in the print style sheet of one of my 
sites as I want no images on a printed page. There are, however, two 
images that _do_ need to print out for the user. I've specified those 
images (checkmarks and crossmarks within tabular data cells) display by 
adding a declaration of td img { display: block !important; } to insure 
that they do (otherwise they won't in IE).

Problem solved? Hardly. Attempt to preview or print the page in Firefox
and the browser freezes. IE, Opera, et al are fine with it, but FF 
chokes on the contradiction.

What's the better way?

Regards,

Lori

__
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] [ccs-d] peekaboo bug in Safari?

2007-03-09 Thread Dave Pierce
Folks, I'm still having problems with this. I've not been able to dig  
up any info about anything like it in any of the 152 odd websites  
I've bookmarked for CSS.

The site in question happily passes the W3 html validator. There  
aren't any hacks anywhere down near the photo in question that might  
cause the problem.

 I'm having a problem with Safari...first I've ever had. So far the
 other browsers are showing this page correctly...but In Safari, the
 picture and caption at the bottom left doesn't fully load.

 The W3 validators say the HTML passes, and the non-compliant IE hacks
 don't pass...but I really don't know any other way to handle those.
 Again, I'm updating info and adding pictures to an older site.

 These are sloppy in code, but they do work...just not elegantly like
 you guys can do.

 Any suggestions or hints as to the picture problem are GREATLY
 appreciated.

 Here's the url: http://pierceartanddesign.com/NewFiles.html/pages/
 buckleylife.html

 Dave

__
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] Wierd IE 6 position: relative with ghosting

2007-03-09 Thread Gunlaug Sørtun
Philippe Wittenbergh wrote:
 But the elements that are positioned relative and moved upwards on  
 that page are not contained within blocks with overflow:hidden

Guess I didn't read well enough through that stylesheet. Now I have 
mixed styles and created confusion - again :-)

 Those elements trigger a scrollbar on body in Safari, iCab, Opera,  
 but not in Gecko
 Especially the div #entry, which is pulled upwards 365 px and has a  
 height specified. Doesn't sound correct.

Other (following) elements (should) adjust to that element's original 
space - not the offset one, so Gecko should not act as if #entry's 
original space isn't down there anymore.

 ---
 Anyway, on overflow:hidden:
  From CSS 2.1, 11.1.1 [1]
 'This property specifies whether content of a block-level element is  
 clipped when it overflows the element's box.'
 
 'clipped' is the keyword. The part of the box that is hidden  
 shouldn't take up any space anymore.

Ok, so 'hidden' means 'clipped' in this context. I've probably seen too 
many non-compliant browser-version on this point through the years, and 
should read a bit more specs.

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] [ccs-d] peekaboo bug in Safari?

2007-03-09 Thread Gunlaug Sørtun
Dave Pierce wrote:
 The site in question happily passes the W3 html validator. There 
 aren't any hacks anywhere down near the photo in question that might 
 cause the problem.

 http://pierceartanddesign.com/NewFiles.html/pages/buckleylife.html

If you add a background-color to #content, you'll find that it doesn't
extend far enough in width and height to contain the text and images.
Only IE6 expands it because of the 'auto-expansion' bug.

Correct those dimensions to...

#content {height: auto; width: 225px;}

...and Safari will present it as intended.

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] [ccs-d] peekaboo bug in Safari?

2007-03-09 Thread Gunlaug Sørtun
Gunlaug Sørtun wrote:
 http://pierceartanddesign.com/NewFiles.html/pages/buckleylife.html
 
 
 If you add a background-color to #content, you'll find that it doesn't
 extend far enough in width and height to contain the text and images.

Just to add and ask around...
Maybe this is a bug in Safari, as there seems to be a limit to _how far_ 
outside an element the default 'overflow: visible' is reliable in that 
browser..?

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] media=print/css problems with IE7

2007-03-09 Thread David Hucklesby
On Thu, 08 Mar 2007 23:02:51 +0100, Ingo Chao wrote:

 Thought I share some findings on this bug. See a reduced testcase [1].

[sample code snipped]

 In IE7 (but not in IE6), only the first page is printed. The print styles 
 reset
 haslayout to false for the parent element.


Um. Just in case some neophyte gets misled, I believe that 'hasLayout'
cannot be reset. Since 'hasLayout' is not a CSS property, it does not
follow CSS rules.

Hopefully someone will correct me if I am wrong.

Cordially,
David
--
www.hucklesby.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] media=print/css problems with IE7

2007-03-09 Thread Gunlaug Sørtun
David Hucklesby wrote:

 Um. Just in case some neophyte gets misled, I believe that
 'hasLayout' cannot be reset. Since 'hasLayout' is not a CSS property,
 it does not follow CSS rules.
 
 Hopefully someone will correct me if I am wrong.

Correction: it depends on which property is used to set it...
http://www.satzansatz.de/cssd/onhavinglayout.html#reset
...since not all properties are reversible.

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] Problems with custom image-bullets (IE of course)

2007-03-09 Thread francky
Jukka K. Korpela wrote:
 [...]
 And fundamentally where do I put the:

 !--[if lte IE 6]
  style type=text/css
  .container li { background-position: 0 .5em; } /* *** IE correction
 *** */
  /style
 ![endif]--

 Does it go in the HTML document  near the list itself?
 

 It goes into the head part of your HTML document, in a place where a 
 style element can appear. Technically this all depends on how IE 
 processes the comment, but in practice it's best to put it in a place 
 where it would belong if it were a style element. (In practice, browsers 
 typically accept style elements outside the head element, but there's 
 hardly any reason to rely on this.)
   
Hi Sarah,
Indeed. - And in addition: the styles in this Conditional Comment for IE 
have to be placed below the lines where the general styles are 
described. Otherwise the normal styles should overrule the special IE 
styles ( and no effect).
Thanks to your question, I've completed the example with these notes. :-)

* Updated Graphical Bullets page
  
http://home.tiscali.nl/developerscorner/css-discuss/test-graphical-bullets.htm

Success and greetings,
francky
__
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] media=print/css problems with IE7

2007-03-09 Thread Ingo Chao
David Hucklesby wrote:
 On Thu, 08 Mar 2007 23:02:51 +0100, Ingo Chao wrote:
 Thought I share some findings on this bug. See a reduced testcase [1].

 [sample code snipped]
 In IE7 (but not in IE6), only the first page is printed. The print styles 
 reset
 haslayout to false for the parent element.

 
 Um. Just in case some neophyte gets misled, I believe that 'hasLayout'
 cannot be reset. Since 'hasLayout' is not a CSS property, it does not
 follow CSS rules.
 
 Hopefully someone will correct me if I am wrong.
 
 Cordially,
 David
 --
 www.hucklesby.com


Sorry for my last posting, it might have led to misunderstanding.


The snipped sample code

#parent {
   position: relative;
   width: 750px;
   }

...

#parent {
   width: auto;
   }


results in haslayout=false for #parent. The property 'width' was reset 
to its default/initial value in a separate rule set.

Some properties allow for this kind of reset or undo, others don't [1].

Another sample code

#parent {
   display: inline-block;
   }

#parent {
  display: inline;
   }

results surprisingly in haslayout=true for #parent, even if display was 
reset to its default/initial value in the second rule set.

But you are right, haslayout is not set by CSS, and it is not reset 
by CSS. haslayout=true can be a internal requirement when setting some 
properties in CSS. It does not follow the CSS rules of overwriting.

Regards,

Ingo

[1] http://www.satzansatz.de/cssd/onhavinglayout.html#reset



-- 
http://www.satzansatz.de/css.html
__
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] [ccs-d] peekaboo bug in Safari?

2007-03-09 Thread Dave Pierce
 I'm having a problem with Safari...first I've ever had. So far the
 other browsers are showing this page correctly...but In Safari, the
 picture and caption at the bottom left doesn't fully load.

 The W3 validators say the HTML passes, and the non-compliant IE hacks
 don't pass...but I really don't know any other way to handle those.
 Again, I'm updating info and adding pictures to an older site.

 These are sloppy in code, but they do work...just not elegantly like
 you guys can do.

Doug wrote:

  I don't know how relevant this is, but in firefox 2.0 (mac),  
 firebug is saying preloadimages()
 is not defined, so it refuses to even function / do basic stuff  
 like show me the DOM tree etc
 A failed javascript function, especially on page load, would cause  
 safari to choke in some fashion, I'm sure

Doug, thanks for that. I deleted it but it didn't make a  
difference...not even sure what that JS is all about...I'm still  
struggling with CSS. I did note however that the picture flashes back  
when you reload the page. Then when you scroll up and back down, the  
pic's only partly there.

Dave

__
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] Problems with custom image-bullets (IE of course)

2007-03-09 Thread Sarah McCall
Thank you so much Francky and Jukka – it makes complete sense now  
you've explained it!

Can I just ask what kind of code the '[if lte IE 6] ... [endif]' is?  
Even though it works, I like to know the details of how, and what  
other programming languages I need to think about learning to enable  
me to make the fullest use of CSS.

Many thanks – your help is much appreciated!

Sarah :)


On 9 Mar 2007, at 18:48, francky wrote:

 !--[if lte IE 6]
 style type=text/css
 .container li { background-position: 0 .5em; } /* *** IE correction
 *** */
 /style
 ![endif]--

__
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] Holy Grail layout + simple javascript = IE6 problems

2007-03-09 Thread Paul Eipper
Hello list, newcomer here :)

I am having problems with a variation of the Holy Grail Layout [1]
when using a very simple javascript that rewrites the innerHTML of a
DIV in the layout.

You can check the problematic layout here:
http://lkraider.eipper.com.br/files/layout/index.html

The javascript code is this:
document.getElementById('text').innerHTML = 'Hello';

I've tried other scripts aswell (hiding DIV's, etc), all cause the same issue.


On Firefox it all works as expected, but on IE6, the 'menu' DIV is
displaced when activating the Javascript code.

Can someone offer some help on which bug is being triggered here and
how could I fix that?


Thanks :D

--
Paul Eipper


[1] http://alistapart.com/articles/holygrail
__
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 style in disabled text boxes ie

2007-03-09 Thread Zoe M. Gillenwater
Ross Hulford wrote:
 The font in disabled textboxes takes on a horrible grey indented look (ie) 
 does anyone know the property and how to overwrite it?
   

Ross,

Many form elements are difficult to style -- and often with good reason. 
You can try the various links on our wiki page for more information:
http://css-discuss.incutio.com/?page=FormElements

Zoe

-- 
Zoe M. Gillenwater
Design Services Manager
UNC Highway Safety Research Center
http://www.hsrc.unc.edu


__
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] Problems with custom image-bullets (IE of course)

2007-03-09 Thread Zoe M. Gillenwater
Sarah McCall wrote:
 Can I just ask what kind of code the '[if lte IE 6] ... [endif]' is?  
 Even though it works, I like to know the details of how, and what  
 other programming languages I need to think about learning to enable  
 me to make the fullest use of CSS.
   

Sarah,

They're called conditional comments. See the link Jukka sent earlier:
http://www.quirksmode.org/css/condcom.html

Zoe

-- 
Zoe M. Gillenwater
Design Services Manager
UNC Highway Safety Research Center
http://www.hsrc.unc.edu


__
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] Firefox !important Image Print Style

2007-03-09 Thread Zoe M. Gillenwater
L. Robinson wrote:
 I've set img to display: none; in the print style sheet of one of my 
 sites as I want no images on a printed page. There are, however, two 
 images that _do_ need to print out for the user. I've specified those 
 images (checkmarks and crossmarks within tabular data cells) display by 
 adding a declaration of td img { display: block !important; } to insure 
 that they do (otherwise they won't in IE).

 Problem solved? Hardly. Attempt to preview or print the page in Firefox
 and the browser freezes. IE, Opera, et al are fine with it, but FF 
 chokes on the contradiction.
   

Can we see a page that exhibits the problem? It may very well be a FF 
bug that you can do nothing about. You may want to search Bugzilla.

 What's the better way?
   

I suppose you could always reverse it: leave *all* images to their 
normal display values in the print sheet, and set the images you *don't* 
want to print to display: none. But I can't tell if your current markup 
would allow this without seeing your page. We can give you more relevant 
help if you show us exactly what you're working with.

Zoe

-- 
Zoe M. Gillenwater
Design Services Manager
UNC Highway Safety Research Center
http://www.hsrc.unc.edu


__
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] Vertical Scrollbar in IE ... Causes horizontal scrollbar

2007-03-09 Thread francky
Beauchamp Michael J CONT NPRI wrote:
 Hi,

 This is probably a FAQ but I can't find the answer...

 I have a problem in IE. I have body overflow set to auto. The width of the 
 document is all percentage and never scrolls horizontally.  However, there is 
 usually a vertical scroll.  The problem is that in IE, when the vertical 
 scrollbar appears, the width of the page stays the same (in terms on actual 
 screen width in pixels), creating a need for horizontal scrolling.  It's as 
 if IE doesn't notice that the scrollbars are using up some of the horizontal 
 space so it never resizes to compensate.

 Can anyone tell me how to solve this?  At the moment I have overflow-y:scroll 
 set so the scrollbar is just always there.  I guess it works... sort of. 

 [unfortunately, I can't post or link to the code.]

 Thanks in advance for any help or pointers to help.
   
Hi Michael,
Strange ... normally IE is *always* making space for the vertical 
scrollbar (up to IE6 under WinXP; in IE6 a transparent vertical 
scrollbar, if not needed). Is it IE7 and/or Vista which is giving your 
results?
I made 2 testpages, a short and a long one, both with body { width: 
100%; overflow: auto; }, and no horizontal scrollbar is appearing in IE.

* Short page
  
http://home.tiscali.nl/developerscorner/css-discuss/test-IEoverflow-scrollbars-short.htm
* Long page
  
http://home.tiscali.nl/developerscorner/css-discuss/test-IEoverflow-scrollbars-long.htm

Is the long page showing the hor. scrollbar at your side? [1]
If not, maybe there is in the css of the content of the longer page 
something like an element with a width in % and a padding-left and/or 
padding-right as well?
Could be also some IE expanding bug - hard to say without code...

Maybe you can isolate the problem in a minimal error page [2] [3], 
replace the remaining content with Lorem's and 1-color images, and send 
us a link to that?

Greetings,
francky

[1] Not yet results of Browsershots at this moment 
http://browsershots.org/website/http://home.tiscali.nl/developerscorner/css-discuss/test-IEoverflow-scrollbars-long.htm#success
[2] The D-Zero Method 
http://home.tiscali.nl/developerscorner/golden-rules-of-css.htm#r13
[3] PIE: Mystery Bug 
http://www.positioniseverything.net/articles/mys-bug.html

__
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] FireFox CSS problem...

2007-03-09 Thread Matt Klein
Thank you all for your time and effort in solving this problem.   The
real problem is that the web server application I was using has no
configuration for MIME types so I couldn't add the text/css MIME type.
In the end,  I moved our website to our ISPs web server and all is well.
 
One less thing I have to maintain.  Woohoo!

-Original Message-
From: Michael Mistak [mailto:[EMAIL PROTECTED] 
Sent: Friday, March 09, 2007 8:17 AM
To: Matt Klein
Cc: css-d@lists.css-discuss.org
Subject: Re: [css-d] FireFox CSS problem...


I have seen a similar issue where Firefox (or any Mozilla browser) won't
recognize a CSS file if it is served with the wrong MIME Type.

So first check that your server is serving .css files with the proper
MIME Type. 

(seems unlikely, but I've come across servers that are configured
improperly for something this basic)

Mike


On 3/7/07, Matt Klein  [EMAIL PROTECTED] wrote: 

Hi all -

I have a web site that I just finished developing. During development, I
had the website in a folder on my local computer with a sub-folder(css)
for storing CSS files.

I tested the site using both IE and FireFox and it displayed perfectly 
in both.

My problem is that once I move it to my web server, IE still displays it
just fine, but FireFox acts as though the CSS files don't exist. The
content appears, but with the CSS files being applied. 

I even changed my references to the CSS files to be explicit paths
instead of relative paths. Still IE is fine and FireFox doesn't seem to
find the CSS files.

I'm a little confused since it all worked fine when the site was on my 
local computer.Here's the link to the site www.sbcne.com/new


Any ideas?


Matt 

__ 
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/





-- 
Michael W. Mistak

Patriotism is loving your country always and your government when it
deserves it -Mark Twain 

If one would give me six lines written by the hand of the most honest
man, I would find something in them to have him hanged. - Cardinal
Richelieu 

__
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] Vertical Scrollbar in IE ... Causes horizontal scroll bar

2007-03-09 Thread Beauchamp Michael J CONT NPRI
Hi Francky,

Thanks for your help. Unfortunately, I'm blocked from seeing your website and 
have no public server myself to post to. However, knowing that this is not 
common and probably not a browser problem is a big help. Now I can assume that 
there is something in my code that is causing the problem. I'll take your 
advice and look for padding issues. 

Thanks again,

Mike

-Original Message-
From: francky [mailto:[EMAIL PROTECTED] 
Sent: Friday, March 09, 2007 3:22 PM
To: Beauchamp Michael J CONT NPRI
Cc: css-d@lists.css-discuss.org
Subject: Re: [css-d] Vertical Scrollbar in IE ... Causes horizontal scrollbar

Beauchamp Michael J CONT NPRI wrote:
 Hi,

 This is probably a FAQ but I can't find the answer...

 I have a problem in IE. I have body overflow set to auto. The width of the 
 document is all percentage and never scrolls horizontally.  However, there is 
 usually a vertical scroll.  The problem is that in IE, when the vertical 
 scrollbar appears, the width of the page stays the same (in terms on actual 
 screen width in pixels), creating a need for horizontal scrolling.  It's as 
 if IE doesn't notice that the scrollbars are using up some of the horizontal 
 space so it never resizes to compensate.

 Can anyone tell me how to solve this?  At the moment I have overflow-y:scroll 
 set so the scrollbar is just always there.  I guess it works... sort of. 

 [unfortunately, I can't post or link to the code.]

 Thanks in advance for any help or pointers to help.
   
Hi Michael,
Strange ... normally IE is *always* making space for the vertical scrollbar (up 
to IE6 under WinXP; in IE6 a transparent vertical scrollbar, if not needed). 
Is it IE7 and/or Vista which is giving your results?
I made 2 testpages, a short and a long one, both with body { width: 
100%; overflow: auto; }, and no horizontal scrollbar is appearing in IE.

* Short page
  
http://home.tiscali.nl/developerscorner/css-discuss/test-IEoverflow-scrollbars-short.htm
* Long page
  
http://home.tiscali.nl/developerscorner/css-discuss/test-IEoverflow-scrollbars-long.htm

Is the long page showing the hor. scrollbar at your side? [1] If not, maybe 
there is in the css of the content of the longer page something like an element 
with a width in % and a padding-left and/or padding-right as well?
Could be also some IE expanding bug - hard to say without code...

Maybe you can isolate the problem in a minimal error page [2] [3], replace 
the remaining content with Lorem's and 1-color images, and send us a link to 
that?

Greetings,
francky

[1] Not yet results of Browsershots at this moment 
http://browsershots.org/website/http://home.tiscali.nl/developerscorner/css-discuss/test-IEoverflow-scrollbars-long.htm#success
[2] The D-Zero Method
http://home.tiscali.nl/developerscorner/golden-rules-of-css.htm#r13
[3] PIE: Mystery Bug
http://www.positioniseverything.net/articles/mys-bug.html
__
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] [ccs-d] peekaboo bug in Safari?

2007-03-09 Thread Dave Pierce
 I'm having a problem with Safari...first I've ever had. So far the
 other browsers are showing this page correctly...but In Safari, the
 picture and caption at the bottom left doesn't fully load.


Georg Graciously answered:

If you add a background-color to #content, you'll find that it doesn't
extend far enough in width and height to contain the text and images.
Only IE6 expands it because of the 'auto-expansion' bug.

Correct those dimensions to...

#content {height: auto; width: 225px;}

and Safari will present it as intended.

regards
Georg

AND he saved the day! Thank you Georg. 
__
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] Fwd: Holy Grail layout + simple javascript = IE6 problems

2007-03-09 Thread Paul Eipper
So, I could track down the problem to a single line. Read post below.
Anyone know a fix for this?

-- Forwarded message --
From: Paul Eipper [EMAIL PROTECTED]
Date: 09/03/2007 18:59
Subject: Re: [css-d] Holy Grail layout + simple javascript = IE6 problems
To: Peter Hyde-Smith [EMAIL PROTECTED]


I posted here exactly because the issue is caused by some IE CSS
rendering problem.

You can see the issue occur whenever IE is forced to redraw the
layout, like when resizing the browser window, for instance. Definitly
not a javascript issue, but an IE bug.

I was hoping someone could identify the bug that was being triggered
and how to correct the stylesheet accordingly to fix it.

Meanwhile I am using the IE7 javascript library [1], since it fixes
most IE6 rendering bugs, including this one. With it, I could track
down the problem to one line on my layout:

#menu {
left: 150px;
}

which, when used with IE7 library causes the same issue, but on all
pages. When removed it works correcly, but not on a clean IE6
environment.

It is the proposed fix for IE6 on the Holy Grail, but the fix itself is buggy.

/*** IE6 Fix ***/
* html #left {
  left: 150px;   /* RC width */
}


If anyone can provide another possible fix for this, I would really be
thankful :)

--
Paul Eipper

[1] http://dean.edwards.name/IE7/


2007/3/9, Peter Hyde-Smith [EMAIL PROTECTED]:
 - Original Message -
 From: Paul Eipper [EMAIL PROTECTED]
 To: CSS-D css-d@lists.css-discuss.org
 Sent: Friday, March 09, 2007 11:21 AM
 Subject: [css-d] Holy Grail layout + simple javascript = IE6 problems


  Hello list, newcomer here :)
 
  I am having problems with a variation of the Holy Grail Layout [1]
  when using a very simple javascript that rewrites the innerHTML of a
  DIV in the layout.
 
  You can check the problematic layout here:
  http://lkraider.eipper.com.br/files/layout/index.html
 
  The javascript code is this:
  document.getElementById('text').innerHTML = 'Hello';
 
  I've tried other scripts aswell (hiding DIV's, etc), all cause the same
  issue.
 
 
  On Firefox it all works as expected, but on IE6, the 'menu' DIV is
  displaced when activating the Javascript code.
 
  Can someone offer some help on which bug is being triggered here and
  how could I fix that?

  Thanks :D
  Paul Eipper

 Paul:

 I suggest you look to a JavaScript oriented list. While I am sure there are
 people on this list who can help, it's a list focused on resolving issues
 with Cascading Style Sheets and the List Administrators are pretty agressive
 about publicly reinforcing that point. So tread with care, even with the
 Holy Grail.

 Cheers,

 Peter
 www.fatpawdesign.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] Vertical Scrollbar in IE ... Causes horizontal scrollbar

2007-03-09 Thread Gunlaug Sørtun
francky wrote:
 Beauchamp Michael J CONT NPRI wrote:

 I have a problem in IE. I have body overflow set to auto. The width
  of the document is all percentage and never scrolls horizontally. 
 However, there is usually a vertical scroll.  The problem is that 
 in IE, when the vertical scrollbar appears, the width of the page 
 stays the same (in terms on actual screen width in pixels), 
 creating a need for horizontal scrolling.

 I made 2 testpages, a short and a long one, both with body { width: 
 100%; overflow: auto; }, and no horizontal scrollbar is appearing in 
 IE.

 * Short page 
 http://home.tiscali.nl/developerscorner/css-discuss/test-IEoverflow-scrollbars-short.htm

You'll get two vertical scrollbars and a horizontal one, when you narrow
the window enough. That goes for both test pages.

The *problem* is 'quirks mode' styles used in 'strict mode' for
controlling browser's own scrollbar. Doesn't work.

Remember that html isn't part of the equation in 'quirks mode', so the
style used on body 'overflow: auto' will control the browsers own
scrollbars. No problem with that.

In 'strict mode' OTOH the html element is in use, and those styles
_must me moved_ onto the html element in order to control the browsers
own scrollbars.
body is just another container, and IE will be give it its own
scrollbars when needed, because of the 'overflow: auto' on it. The
browser's own scrollbars will not be affected by 'overflow: hidden'
declared on body.

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] Problems with custom image-bullets (IE of course)

2007-03-09 Thread francky
Sarah McCall wrote:
 [...]
 Can I just ask what kind of code the '[if lte IE 6] ... [endif]' is? 
 Even though it works, I like to know the details of how, 
Well, it is not html, not css and not a programming language - it's a 
part of Microsoft's IE language ...
The MSIE language is just IE only, and IMO it shouldn't be used unless 
to correct IE bugs. ;-)
How the Conditional Comments (the name for the '[if lte IE 6] ... 
[endif]' stuff) are working, is explained by Microsoft in a MSDN page:

* About Conditional Comments
  
http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/overview/ccomment_ovw.asp

... though their examples could be a bit updated:

* test :: Microsoft's IE CC information  :-)
  
http://home.tiscali.nl/developerscorner/css-discuss/test-IE-cc-information.htm

Besides the link of Jukka, lots of practical suggestions about filtering 
on Georg's page:

* CSS sledgehammer...#2 http://www.gunlaug.no/contents/wd_1_02_01.html

 [...]
 and what other programming languages I need to think about learning to 
 enable me to make the fullest use of CSS.
 [...]

In my opinion, css and (x)html should be enough; added can be some 
knowledge about javascript for some (dynamical) features and tricks.

But for the fullest use of CSS a kind of bug destroying language  :-)  
is developed, which is no language at all, but a series of hacks and 
workarounds, gathered from all over the world, to force that browsers 
(and especially IE) are doing what should be expected according to the 
w3c css specs. For this, I can recommend 'Position Is Everything - 
modern browser bugs explained in detail':

* PIE, startpage http://www.positioniseverything.net/
* PIE, IE troubles http://www.positioniseverything.net/explorer.html

Greetings,
francky

__
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] Vertical Scrollbar in IE ... Causes horizontal scroll bar

2007-03-09 Thread francky
Beauchamp Michael J CONT NPRI wrote:
 Hi Francky,

 Thanks for your help. Unfortunately, I'm blocked from seeing your website and 
 have no public server myself to post to. However, knowing that this is not 
 common and probably not a browser problem is a big help. Now I can assume 
 that there is something in my code that is causing the problem. I'll take 
 your advice and look for padding issues. 

 Thanks again,

 Mike

   
 Francky wrote:
 [...]
 [1] Not yet results of Browsershots at this moment 
 http://browsershots.org/website/http://home.tiscali.nl/developerscorner/css-discuss/test-IEoverflow-scrollbars-long.htm#success
 [2] The D-Zero Method
 http://home.tiscali.nl/developerscorner/golden-rules-of-css.htm#r13
 [3] PIE: Mystery Bug
 http://www.positioniseverything.net/articles/mys-bug.html
   
Hi Mike,
In the meantime the Browsershots 
http://browsershots.org/website/http://home.tiscali.nl/developerscorner/css-discuss/test-IEoverflow-scrollbars-long.htm#success
are finished, and I can see on them that, as expected, no one of the 
IE's (IE5.1, IE5.5, IE6, IE7) is showing a hor. scrollbar for the long page.

Success!
francky
__
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] 2-column layout problems and anchor links

2007-03-09 Thread David Roberts
Hi

I have a problem with a 2 column  layout which is working on some  
pages in IE but not others. It is dropping down below the first  
column. They are both floated col, one left one right. Should I be  
using: display:inline (hack) ? I am not having this problem with any  
other columns set up that I am using.

Problem columns:

  link http://www.campbeltowngrammar.org.uk/main/art_depart


Also I am having a problem with anchor links in IE. The links  
themselves are working ok it is the (return) to Top anchor that does  
not work. This is the code that I am using.

h3a href=#attendanceAttendance/a/h3

h3a name=attendanceAttendance/a/h3

pa href=#topTop/a/p

link http://www.campbeltowngrammar.org.uk/?/main/a-z_a

Thanks

David
__
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] 2-column layout problems and anchor links

2007-03-09 Thread ~davidLaakso
David Roberts wrote:
 I have a problem with a 2 column  layout which is working on some  
 pages in IE but not others. It is dropping down below the first  
 column. They are both floated col, one left one right. Should I be  
 using: display:inline (hack) ? I am not having this problem with any  
 other columns set up that I am using.

 Problem columns:

   link http://www.campbeltowngrammar.org.uk/main/art_depart
   



For the above page, add a rule set to your CSS-- something like this:
#col4 ul { margin: 0; padding: 0; background-color: lime; float: right; 
width: 220px;}
And validate the CSS file.





 Also I am having a problem with anchor links in IE. The links  
 themselves are working ok it is the (return) to Top anchor that does  
 not work. This is the code that I am using.

 h3a href=#attendanceAttendance/a/h3

 h3a name=attendanceAttendance/a/h3

 pa href=#topTop/a/p

 link http://www.campbeltowngrammar.org.uk/?/main/a-z_a
   


Validate the markup of the above page and see if that makes a difference.




 David

   


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/