Re: [css-d] Jumping buttons in IE6 fixed position hack. - alternative

[francky]

Gunlaug Sørtun schreef:
> Christopher Blake wrote:
>
>   
>> http://domain1255110.sites.fasthosts.com/uni/index6.html   html
>> 
>
>   
>> I have been playing around with this hack and it seems like my 
>> earlier attempts were over complicating things. This is the revised 
>> version but I am still experiencing problems with the rollover images
>>  (see original post *). And I think that there is a little problem at
>>  the bottom too.
>> 
>
> You're still over complicating things - not just for old IE/win. Makes
> it pretty hard to fix things without rewriting everything, so the
> following is more like "a conditional patch"...
> 
> ...which is something I don't like creating.
>
> All relevant IE/win styles in page-head, and *note* that I have altered
> the source-code.
>
> Fixes for "jumping buttons" and "containing floats" are included and 
> commented.
>
> IE6 (and older) will produce an "endless scrollbar" on windows shorter
> than 640px. That can't be helped unless both stylesheets and parts of
> the source-code are rewritten, and I don't have time for that. The fixed
> sidebar is pretty much ruined in all browsers at such short windows
> anyway. It's too tall.
>
> regards
>   Georg
>   
Hi Christopher,
I agree: in this model the left column is not visible at 1024x768 
resolution. It is not "a little problem at the bottom". Seems the only 
way is to paste an extra scrollbar for the left column (frame-like), but 
I think that is ugly and not good usable/accessible, apart from the 
cross browser issues. If you're fighting a deadline, I should forget 
spending time to try to get this layout working, and quickly develop an 
easy working new one...

To compensate for the bad news, I made an alternative testpage 
.

Just scrolling straight up & down - I guess nobody will miss the fixed 
sidebar. Solutions for enabling clientside font scaling of the menu (now 
breaking the layout) are included, also some adapted images.

Success and greetings,
francky

btw: fixed the html-validation errors (an overcomplete  and some 
smaller things). Even when in a hurry: testing is life insurance! ;-)

__
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] Jumping buttons in IE6 fixed position hack. - update

[Gunlaug Sørtun]

Christopher Blake wrote:

> http://domain1255110.sites.fasthosts.com/uni/index6.html   html

> I have been playing around with this hack and it seems like my 
> earlier attempts were over complicating things. This is the revised 
> version but I am still experiencing problems with the rollover images
>  (see original post *). And I think that there is a little problem at
>  the bottom too.

You're still over complicating things - not just for old IE/win. Makes
it pretty hard to fix things without rewriting everything, so the
following is more like "a conditional patch"...

...which is something I don't like creating.

All relevant IE/win styles in page-head, and *note* that I have altered
the source-code.

Fixes for "jumping buttons" and "containing floats" are included and 
commented.

IE6 (and older) will produce an "endless scrollbar" on windows shorter
than 640px. That can't be helped unless both stylesheets and parts of
the source-code are rewritten, and I don't have time for that. The fixed
sidebar is pretty much ruined in all browsers at such short windows
anyway. It's too tall.

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] Tabs not displaying right in IE

[David Hucklesby]

On Thu, 22 Feb 2007 13:45:31 -0500, Brian Jones wrote:
>
> I have created a tab navigation menu and it displays fine in Firefox, but in 
> IE there
> is a gap between the tabs and the tabbox. [...]
>
> Here's the html
> http://astro.temple.edu/~tua14115/tabs.html
>
> Here's the css
> http://astro.temple.edu/~tua14115/css/tabs.css
>
Hi Brian,

It looks like IE is applying the 10px top margin you assigned to #tabbox.
Try removing that. The margin should, I believe, slide under any preceding
float, but IE has been known to do some things oddly.

BTW - The design is not altogether successful on my computer, even
at "medium" font sizes. In common with high definition laptops, mine
is set to 120 DPI. This makes font-sizes 25% bigger in IE and Opera,
so the text overflows the tabs.

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] IE6 ol list bug

[Philippe Wittenbergh]

Ingo Chao wrote:

> Eystein Alnaes wrote:
>> I'm having trouble making IE6 display the numbers in a ordered  
>> list...
>
>> #breadcrumbs li {
>> float: left;
>> background: transparent;
>> list-style: decimal;
>> padding-left: 30px;
>> margin-left: 30px;
>> }
>
>
> If haslayout is set on li in an ol,  it will disrupt the numbering
> (you'll get 1. 1. 1. 1.) and because this looks so wrong, float  
> will cut
> this number itself in addition.
>
> google site:archivist.incutio.com IE6 ol
>
> In addition
> http://www.brunildo.org/test/IEul1.html
>
> I'm afraid there is no fix.

In addition to what Ingo noted.
When you float a  in IE, it changes the display property form  
display:list-item to display:block. In that case, no list marker is  
generated anymore.

Other browsers (Gecko, Safari), treat display:list-item as a special  
case of display:block (per the specs I believe), and when floating a  
list-item, they don't change the value of the display property. And  
IE treats display:list-item as a sort of inline element.

Philippe
---
Philippe Wittenbergh





__
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] Tabs not displaying right in IE

[francky]

Brian Jones schreef:
> Hi,
>
> I have created a tab navigation menu and it displays fine in Firefox,
> but in IE there is a gap between the tabs and the tabbox. I've tried
> playing around with it but I still can't get it to display correctly
> in both browsers. Any help would be greatly appreciated.
>
> Here's the html
> http://astro.temple.edu/~tua14115/tabs.html
>
>
> Here's the css
> http://astro.temple.edu/~tua14115/css/tabs.css
>
> Thanx
Hi Brian,
The margin-top of 10px for the #tabbox is not good for IE: can be 
deleted. Then give "HasLayout" [1] for IE with { height: 1%;} in the 
#tabbox. No more problem. :-)
Some other things:

* The fixed line-height (13px) of the #tab is pulverizing the
  ability for good font-scaling by the visitor; can be deleted.
* Setting a font-family for the tabs will enable a better
  positioning of the tab texts (by fine tuning of the margins /
  paddings).
* Enlarging the background images for the tabs is also needed for
  clientside font-scaling.
* Adding bg colors for the tabs is satisfying the css-validator
  warnings, and enabling visitors with disabled background images to
  see the tabs as well.

See fresh testpage 


Success and greetings,
francky

[1]
http://www.satzansatz.de/cssd/onhavinglayout.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] Is there a CSS solution for a wide screen monitor?

[Michael Geary]

Let's take this offlist so we don't overstay our welcome here. :-)

But basically, yeah, it really is a matter of finding out what the native
resolution of the monitor is and setting the OS to match that resolution.

I'll get back to you later offlist with further thoughts...

> This sounds almost identical to the problem I'd brought up 
> several weeks back (see the thread wide-screen monitors and 
> sites).  Today I visited the client who has the widescreen 
> laptop which displays everything stretched horizontally.  
> Images (256h x192w) display as approximately square.  These 
> folks just assume that wrong is right so accept this as 
> normal.  They are not techy - but and use.  I looked at the 
> display properties in windows and hers was set to 1024x768.  
> Would we (or her) simply have to go through the options until 
> we find one that looks 'right'. 
> 
> Or is there a right way for a non-techy to get it right?  
> Read the manual? Sounds optimistic. -Bob


__
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] Is there a CSS solution for a wide screen monitor?

[Bob Meetin]

This sounds almost identical to the problem I'd brought up several weeks 
back (see the thread wide-screen monitors and sites).  Today I visited 
the client who has the widescreen laptop which displays everything 
stretched horizontally.  Images (256h x192w) display as approximately 
square.  These folks just assume that wrong is right so accept this as 
normal.  They are not techy - but and use.  I looked at the display 
properties in windows and hers was set to 1024x768.  Would we (or her) 
simply have to go through the options until we find one that looks 
'right'. 

Or is there a right way for a non-techy to get it right?  Read the 
manual? Sounds optimistic. -Bob

Michael Geary wrote:
> It sounds like your client simply has their monitor set to the wrong video
> mode, i.e. a 4:3 mode such as 1600x1200. If so, they will see this
> stretching in everything they do, not just web browsing. It's the same thing
> you see on so many widescreen TVs that are being used to watch conventional
> 4:3 television - stretch city.
>
> Here is a good test: Have your client view the "rose0" image in the browser
> directly:
>
> http://staff.reynolds.edu/mcline/images/rose0.gif
>
> If that image is stretched, then it's the monitor resolution. In that case,
> there is nothing you can do on your website to work around it.
>
> Instead, help your client set the monitor resolution properly. Find out the
> native resolution of the monitor and make sure their operating system's
> display control panel is set to that resolution.
>
> Feel free to drop me a note offlist with any related questions.
>
> -Mike
>
>   
>> From: Kimberly Batteau
>>
>> This may be OT; I hope not; I hope there is a CSS solution.
>>
>> I built this site http://staff.reynolds.edu/mcline/index.html 
>> and tested it using "standard-sized" monitors, perhaps 16 or 17 inch.
>>
>> My client recently bought a 19" flat screen monitor & 
>> everything on this new monitor is stretched horizontally to 
>> make it fit into the full width (which is actually about 
>> 16"). This stretching occurs in IE7, Opera9
>>
>> Surprisingly, not all of the background image (
>> http://staff.reynolds.edu/mcline/bgs/trial10.jpg) for the 
>> home page is used.
>> Even though the image is over 16.5 inches wide, the browsers 
>> use about 14.3inches of the width and stretch it out to 16".
>>
>> The best example of the stretching at the bottom of this page 
>> http://staff.reynolds.edu/mcline/pages/myart.html , where the 
>> disk should be circular, but appears to be quite ovate on the 
>> wide monitor.
>>
>> Admittedly, I am not a CSS guru and this site is not a 
>> stellar example of CSS, but is there some to use CSS to 
>> compensate for this?
>> 
>
> __
> 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] Jumping buttons in IE6 fixed position hack. - update

[Christopher Blake]

On 22 Feb 2007, at 22:45, Chris Hoffman wrote:

> On 2/22/07, Christopher Blake <[EMAIL PROTECTED]> wrote:
>
>> * Left hand side column is position fixed. Internet explorer hack is
>> nearly working except for the navigation. It holds position in the
>> viewport however the buttons jump on rollover. I don't understand
>> this and what makes it even more confusing is that it only happens to
>> the bottom three (not the entire five).
>
> IE 6 on Windows XP is also showing some weird behavior where the
> scrollbar compresses as the navigation moves down and the main
> contents move up, leaving the screen blank...
>
> Chris

http://domain1255110.sites.fasthosts.com/uni/index6.html   html

http://domain1255110.sites.fasthosts.com/uni/stylefile/ 
style4ie2.csshack

http://domain1255110.sites.fasthosts.com/uni/stylefile/ 
stylenp.css css

I have been playing around with this hack and it seems like my  
earlier attempts were over complicating things. This is the revised  
version but I am still experiencing problems with the rollover images  
(see original post *). And I think that there is a little problem at  
the bottom too.

I am running from mac os -so cannot test in IE6 and below. It really  
annoys me. Thanks Chris for pointing out the other problem - is it  
still there? Any how, I am at a complete loss as how to fix this  
(especially as I cannot view any of my attempts in the conflicting  
browser).

I just moan from here really.

I knew after my last (first site) that this navigation was not  
practical (large items being fixed) but because someone saw that site  
and liked it - that is what they want and I am not in a position to  
speak on this one. I am supposed to have this template done by  
tomorrow - the main content being data driven. I can't wait to get  
rid of it - I did not chose to make it look like this - it makes me  
want to vomit. I have one to do after where I will have a fair amount  
of freedom. Please, someone help me get through tomorrow.

apologies to any moderators. I just needed a moan.

Thanks all.


> __
> 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] Jumping buttons in IE6 fixed position hack.

[Chris Hoffman]

On 2/22/07, Christopher Blake <[EMAIL PROTECTED]> wrote:

> Left hand side column is position fixed. Internet explorer hack is
> nearly working except for the navigation. It holds position in the
> viewport however the buttons jump on rollover. I don't understand
> this and what makes it even more confusing is that it only happens to
> the bottom three (not the entire five).

IE 6 on Windows XP is also showing some weird behavior where the
scrollbar compresses as the navigation moves down and the main
contents move up, leaving the screen blank...

Chris
__
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] Tabs not displaying right in IE

[Brian Jones]

Hi,

I have created a tab navigation menu and it displays fine in Firefox,
but in IE there is a gap between the tabs and the tabbox. I've tried
playing around with it but I still can't get it to display correctly
in both browsers. Any help would be greatly appreciated.

Here's the html
http://astro.temple.edu/~tua14115/tabs.html


Here's the css
http://astro.temple.edu/~tua14115/css/tabs.css

Thanx
__
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] absolute positioning headaches

[Kenny Graham]

> from what i've read it is my understanding that absolute positioning will
> position an element absolutely based upon the nearest positioned element. so
> if i have an absolute position in my code that is directly under a
> relatively positioned element it should place it in relation to that object
> rather than at the top of the page correct? this is a confusing issue to me
> for some reason

Not to the nearest positioned element, it'll position it relative to
the nearest positioned -ancestor-. So if it's parent element is
positioned, it'll position relative to that.  If it's
great-grandparent is positioned, and its grandparent and parent
aren't, it'll position relative to the great-grandparent.  If none of
its ancestors are positioned, it'll position relative to the root
(html) element.
__
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] fixed positioning problems in ie6 (and probably below)

[Christopher Blake]

On 22 Feb 2007, at 16:07, Gunlaug Sørtun wrote:
Christopher Blake wrote:
http://domain1255110.sites.fasthosts.com/uni/index5.html

1: you're overstyling for IE6 :-)

The left column is the only element that shall be 'fixed' to the top...

* html #Lcolumn{
position: absolute;
top:expression(eval(document.compatMode &&
document.compatMode=='CSS1Compat') ?
documentElement.scrollTop : document.body.scrollTop);
}

...and all elements inside it just follows - with no or minimal
margin-adjustments for perfect line-up.
It works the same way in browsers that understands 'position: fixed'
properly - only the container needs positioning.

I feel really stupid now. What a good fix! I was half going off the  
one I used for the Neil Parish site.

The elements 'fixed' to the bottom are correctly styled for IE6 - and
are just in need of some slight adjustments. Leave those till later.

It's difficult for me to see what is happening because I am a mac -  
without IE. However I have friends on msn that i  occasionally get  
descriptions and screen shots from. I can see that there is a gap at  
the bottom from these grabs - but as always - it's not like that on  
any of my browsers - and I don't understand.


2: you're running into the "endless scroll" that will always be a
problem when 'fixing' tall elements in IE6. Easy to see if you make the
browser-window shorter.
Note that tall 'fixed' elements will be a problem in all browsers since
what goes "off-screen" stays "off-screen" - out of reach, but the
problem is worst when we simulate 'fixed' in older IE/win.

Read the "large elements “fixed” to viewport" part in my article...

...and see if you can manage to fix it at your end.

I had a good read of this article and understand and agree  
completely. I am maturing as a css writer - but unfortunately I have  
had no say in this project. I have had no say in it's look, or design.

Don't worry, it can be done...

I'm not too worried - except deadline for everything on the page  
except the data driven content is by the end of tonight. I have  
another job that I have a lot more say in how it is done and am  
looking forward to developing some solid css.



regards
Georg
-- 
http://www.gunlaug.no

Oh yeh, I also made a post about jumping buttons - in rollover state.  
Did you see these too? Any ideas on how to fix them?

Kind regards, Chris




__
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] fixed positioning problems in ie6 (and probably below)

[Gunlaug Sørtun]

Christopher Blake wrote:
>> http://domain1255110.sites.fasthosts.com/uni/index5.html

1: you're overstyling for IE6 :-)

The left column is the only element that shall be 'fixed' to the top...

* html #Lcolumn{
position: absolute;
top:expression(eval(document.compatMode &&
document.compatMode=='CSS1Compat') ?
documentElement.scrollTop : document.body.scrollTop);
}

...and all elements inside it just follows - with no or minimal
margin-adjustments for perfect line-up.
It works the same way in browsers that understands 'position: fixed'
properly - only the container needs positioning.

The elements 'fixed' to the bottom are correctly styled for IE6 - and
are just in need of some slight adjustments. Leave those till later.


2: you're running into the "endless scroll" that will always be a
problem when 'fixing' tall elements in IE6. Easy to see if you make the
browser-window shorter.
Note that tall 'fixed' elements will be a problem in all browsers since
what goes "off-screen" stays "off-screen" - out of reach, but the
problem is worst when we simulate 'fixed' in older IE/win.

Read the "large elements “fixed” to viewport" part in my article...

...and see if you can manage to fix it at your end.
Don't worry, it can be done...


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] Hover issue

[Kenoli Oleari]

Great.  It works. Finally!

Thanks so much,

--Kenoli

On Feb 21, 2007, at 6:29 PM, francky wrote:

> Kenoli Oleari wrote:
>> This now my code in the stylesheet and I am still getting a  
>> background on hover:
>>
>> a {
>> color: #FF;
>> font-size: small;
>> }
>> a:active {color: #339933; }
>>
>> a:visited {color: #006633; }
>>
>> a:hover {
>> color: #003366;
>> background-color: #00}
>>
>> a.button:hover { background-color: none; }
>>
> Hi Kenoli,
> Oops, focused on the cascade order, I didn't notice before; but it  
> has to be:
>
>a.button:hover { background-color: transparent; }
>
> or
>
>a.button:hover { background: none; }
>
> for
>
>a.button:hover { background-color: none; }
>
> is not valid css. A color "none" doesn't exist! :-)
> If {background: none;}is set, then all properties are set to their  
> initial values (which is transparent for a background-color).
> See: css-specs, background-properties  colors.html#background-properties>
>
> Greetings,
> francky
>
>

Kenoli Oleari
1801 Fairview Street
Berkeley, CA  94703
Neighborhood Assemblies Network
510-601-8217, [EMAIL PROTECTED]
http://www.sfnan.org, http://www.horizonsofchange.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] absolute positioning headaches

[jeffrey morin]

hello everyone,

from what i've read it is my understanding that absolute positioning will
position an element absolutely based upon the nearest positioned element. so
if i have an absolute position in my code that is directly under a
relatively positioned element it should place it in relation to that object
rather than at the top of the page correct? this is a confusing issue to me
for some reason

-- 
Jeff
__
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] Jumping buttons in IE6 fixed position hack.

[Christopher Blake]

Hi folks,

Left hand side column is position fixed. Internet explorer hack is  
nearly working except for the navigation. It holds position in the  
viewport however the buttons jump on rollover. I don't understand  
this and what makes it even more confusing is that it only happens to  
the bottom three (not the entire five).

 From previous experience I can see that css can be added to the  
#menu2 li ain the hack - but what is it doing? How do I calculate  
the changes to make to counter act the movement and what changes do i  
need to make. I suppose it will only concern the hover state  - I  
don't know.

Please help - so close to being done.

http://domain1255110.sites.fasthosts.com/uni/index5.html   -html

http://domain1255110.sites.fasthosts.com/uni/stylefile/stylenp.css   - 
standard css

http://domain1255110.sites.fasthosts.com/uni/stylefile/style4ie.css
-hack

Best wishes, Chris





__
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] IE6 ol list bug

[Ingo Chao]

Eystein Alnaes wrote:
> I'm having trouble making IE6 display the numbers in a ordered list...

> #breadcrumbs li {
> float: left;
> background: transparent;
> list-style: decimal;
> padding-left: 30px;
> margin-left: 30px;
> }


If haslayout is set on li in an ol,  it will disrupt the numbering 
(you'll get 1. 1. 1. 1.) and because this looks so wrong, float will cut 
this number itself in addition.

google site:archivist.incutio.com IE6 ol

In addition
http://www.brunildo.org/test/IEul1.html

I'm afraid there is no fix.

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] line break and fieldset height problems

[Bill Walton]

Hi Kenny,

Kenny Graham wrote:
> Don't have time right now to figure out what
> would work tho.

Thank you for making the time to reply.  I appreciate it.  And I especially 
appreciated that comment.  It had a very 'familiar ring' to it.  As a 
developer, I've given very similar feedback to newbie coders over the years.

> Maybe someone else will.

And the fact that no one else has chimed in confirms for me what your 
comment made me recognize.  My current CSS is the equivalent of a big pile 
of spaghetti code.  "Can't fix this thing without breaking others."  So I'm 
following the advice I've given on so many occassions.  Back up, start over, 
and get the basics working right first.  I've made some progress already 
this morning but was hoping for a confirmation on my strategy which is...

Work from the top of the page down.  Floats first.  Then the elements that 
flow 'naturally'.

Is that headed in the right direction?

Thanks again,
Bill 


__
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] fixed positioning problems in ie6 (and probably below)

[Christopher Blake]

> Christopher Blake wrote:
>> http://domain1255110.sites.fasthosts.com/uni/index4.html
>
>> I know that there is a hack to help this but don't understand it when
>>  I read it. I want to start learning how and why I need to create
>> these hacks so any useful links would be appreciated. So far I have
>> found this; http://tagsoup.com/cookbook/css/fixed/ but the trouble
>> being I don't really understand it - what it is telling me to do, how
>>  it works in my context etc.
>
> A couple of alternatives:
>
> Ordinary CSS solution...
> 
> ...which works more or less as the one you've found.
>
> IE-expressions...
> 
> ...which works better IMO, but requires Javascript support in IE/win.
>
> Hope my descriptions are slightly easier to understand :-)
>
> regards
>   Georg
> --  
> http://www.gunlaug.no
> __
>
I have changed where I am working from.

> http://domain1255110.sites.fasthosts.com/uni/index5.html

http://domain1255110.sites.fasthosts.com/uni/stylefile/stylenp.css

http://domain1255110.sites.fasthosts.com/uni/stylefile/ 
style4ie.css- THE HACK

I have nearly got it except the #Lcolumn (container with black  
background) is completely missing.

Any ideas?

>

__
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] navigation height expanding!

[jeffrey morin]

It's because you're positioning "in thin air". That #mainNav isn't

> positioned relative to any element in the page, so browsers either
> position it relative to body - which vary with browser-window, or drop
> it where it suits them.
>
> 1: add...
> #wrapper {
> position: relative;
> }
> ...to create a relation.
>
> 2: correct to...
> #mainNav {
> top: 147px;
> right: 0;
> }
> ...to position it correctly in relation to #wrapper.
>
> Result: no more guesswork for those poor browsers, so they'll all get it
> right :-)
>
> regards
> Georg
> --
> http://www.gunlaug.no
>


i always have had trouble with absolute positioning. that worked perfectly!
thanks a lot.
__
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] IE6 ol list bug

[Eystein Alnaes]

I'm having trouble making IE6 display the numbers in a ordered list. I know
list backgrounds are a problem, but here I'm using the lists' own numbers.
Works in FF and Safari. But not IE. I've tried all the tips at
http://www.positioniseverything.net/explorer/ie-listbug.html and other
places, but they are all for backgrounds...


Company
Travel Mgr.
Payment
Confirmation


ol#breadcrumbs {
text-transform: uppercase;
font-size: 80%;
margin: 10px 0 40px 0px;
overflow: hidden;
}

#breadcrumbs li {
float: left;
background: transparent;
list-style: decimal;
padding-left: 30px;
margin-left: 30px;
}

~eys
__
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] fixed positioning problems in ie6 (and probably below)

[Austin Harris]

There is a very similar discussion going on over on The List at the moment...


Austin
__
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] fixed positioning problems in ie6 (and probably below)

[Christopher Blake]

> Christopher Blake wrote:
>> http://domain1255110.sites.fasthosts.com/uni/index4.html
>
>> I know that there is a hack to help this but don't understand it when
>>  I read it. I want to start learning how and why I need to create  
>> these hacks so any useful links would be appreciated. So far I  
>> have found this; http://tagsoup.com/cookbook/css/fixed/ but the  
>> trouble being I don't really understand it - what it is telling me  
>> to do, how
>>  it works in my context etc.
>
> A couple of alternatives:
>
> Ordinary CSS solution...
> 
> ...which works more or less as the one you've found.
>
> IE-expressions...
> 
> ...which works better IMO, but requires Javascript support in IE/win.


I have been trying to use additions_15html to achieve fixed.

http://domain1255110.sites.fasthosts.com/uni/index4.html

http://domain1255110.sites.fasthosts.com/uni/stylefile/ 
myiefixedhack.css   (hack)

http://domain1255110.sites.fasthosts.com/uni/stylefile/stylenp.css

I have also looked at the previous hack that I used for the Neil  
Parish Site and saw that it was either fix top or bottom - and then  
adding margins to the items in between. I have tried to do the same  
but it isn't working.

http://www.neilparishmep.org.uk/

http://www.neilparishmep.org.uk/stylefile/style1.css

http://www.neilparishmep.org.uk/stylefile/style4ie.css (previous hack)

I have also noticed that in this one there are some adjustments to  
#menu li a   too.

kind regards, Chris


>
> Hope my descriptions are slightly easier to understand :-)
>
a lot easier - thanks.

> 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] clear :after method

[Gunlaug Sørtun]

Web Developer wrote:
> hey Gunlaug Sørtun, i was just curious, it says "As of IE7, overflow 
> became a layout-trigger." wasnt this a layout trigger in previous IE 
> versions though?
> 
> I remember applying overflow: hidden or auto to divs which contain 
> floats which then contains the floats... i thought the reason was 
> since it gave the parent element 'hasLayout' in IE < 6 as well?
> 
> is this not true?

No.
The overflow property was/is only controlling overflow itself in IE6 and
older, and 'overflow: hidden/auto;' would/will only work properly in
that respect in those old versions if the element had/has specific width
and height. No 'Layout'-triggering effect in IE6 and older.

When using 'overflow: hidden/auto;' to establish a new 'Block formatting
contexts'[1] - which is the effect we're after in standard compliant
browsers, we usually had to - and still have to - reset 'overflow' to
'visible' in older IE to avoid element-collapsing in IE5/win, and then
add a "regular" 'hasLayout' trigger for IE6 and older.

Example: this...
element {overflow: hidden;}
* html element {overflow: visible; height: 1%;}
...is a quite normal "auto-contain" styling that "saves" IE5/win from
collapsing and gives IE5+/win its own 'hasLayout' trigger.

A variant...
element {overflow: hidden;}
* html element {overflow: visible; display: inline-block;}
...works as intended in IE/Mac too in most cases.

None of the above examples are "fool proof", as the 'overflow: hidden'
does what it says and hides what's "over the edge" in all browsers that
sees it. Example...



regards
Georg

[1]http://www.w3.org/TR/CSS21/visuren.html#q15
-- 
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] IE Print Defect

[George Ornbo]

> [EMAIL PROTECTED] wrote:
> >  Has anyone noticed IE not printing out all the text from a web page
> > before? It is doing that to me now. Most of the words are there but
> > a few that should be at the end of a line before it wraps to the
> > next line have disappeared.

I've always used this method to produce print stylesheets and it works fine

http://alistapart.com/articles/goingtoprint/

Try that.

Cheers
George

Shape Shed | www.shapeshed.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] IE Print Defect

[Rob Crowther]

[EMAIL PROTECTED] wrote:
>  Has anyone noticed IE not printing out all the text from a web page
> before? It is doing that to me now. Most of the words are there but
> a few that should be at the end of a line before it wraps to the
> next line have disappeared.
>  
I've seen it when the text was in a fixed width container, IE (and
Firefox AFAIK) doesn't automatically shrink the box to fit on paper but
keeps it at the equivalent on-screen width.

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