Re: [css-d] transparent pngs don't show transparent in IE6
[EMAIL PROTECTED] wrote: > Before I go delving into these. Do any of them validate. If no then I can't > use them. They're both the same solution; the blog post I mentioned links to Rick's twinhelix.com site. The stylesheet won't validate due to the nonstandard 'behaviour' property used (it's yet another proprietary IE thing) -- but this can be avoided by applying the 'behaviour' property via javascript or inside conditional comments (which aren't standards, but will validate). A javascript example is in the demonstration source code at http://www.twinhelix.com/css/iepngfix/demo/. -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/
Re: [css-d] transparent pngs don't show transparent in IE6
I came across this post a couple of days ago which provides the fix - http://bjorkoy.com/past/2007/4/8/the_easiest_way_to_png/ It uses a behaviour (.htc) file to work the magic. It'll work on background images too. It's an ugly, ugly solution. But we've been left with little choice :( There's an A List Apart article from a few years back that provides a good overview of the problem - http://alistapart.com/stories/pngopacity/, but the techniques it advocates only work for img elements and are pretty well outdated now. HTH, 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/
Re: [css-d] png color and IE7
You could try 'pngcrush' - http://pmt.sourceforge.net/pngcrush/ I've found it useful for shrinking pngs (Photoshop seems to output really big ones) and solving this colour mis-match. No idea why or how though :) -Rob -- Rob Wilmshurst [EMAIL PROTECTED] __ 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 border when i click over a link
Hi Jean-Claude,
You need to set the property 'outline' on a:focus, eg a:focus { outline:
none; }
It's a CSS3 property, which I believe most browsers other than IE
recognize. Basically, it sits outside of any specified border and does
not take up any space in the document flow (see
http://unfortunatelypaul.com/2006/11/15/the-css-outline-property/ for
more into).
I personally wouldn't do this though; as part of the browser's default
behaviour the user is expecting it. That outline indicates that the
link is currently active. It may be annoying when clicking, but if one
is tabbing through the document then it's the only thing to show what's
currently in focus. I think it's something to be changed via custom
stylesheets in Firefox, at the user's end of things.
HTH,
Rob
--
Rob Wilmshurst
[EMAIL PROTECTED]
__
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] alternating coloured rows in dynamic website
Hi Ian,
> tr .even{background:#eee}
> tr.odd{background:#F9FBF9}
It's not because of the space before '.even' is it?
Will that not affect children of the , rather than the itself?
Of course, it could just be that Thunderbird is messing with me this
morning :)
-Rob
--
Rob Wilmshurst
[EMAIL PROTECTED]
__
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] first posting
Hi Ana,
The reason the #globalNavi is in the wrong order is because each is
individually floated right. So the browser sees the first element,
'home', and sends it to the right. Elements appearing afterwards are
'queued' to the right, putting them in the opposite order to what you
intended.
To solve this, you can remove the 'float:right' on the li { } rule, and
remove the width declaration from 'globalNavi'. Thus, globalNavi will
float to the right, but elements within it are left-aligned. You'll
also need to reduce the margin-top on #globalNavi to prevent it from
dropping down too far.
As for the modifications to subNavi, the CSS rules are not specific
enough. Whenever you adjust the ul { } rules, they are affecting
*every* on the page.
If you make the rules more specific by defining a rule such as '#subnavi
ul li { ...styles... }', you will only affect the subnavi. Something
such as this should do the trick:
#globalNavi {
float: right;
margin: 66px 50px 0 0; /* or whatever... */
padding: 0;
background: #FF7B27 url('../images/navbar.gif') repeat-x bottom left;
list-style: none;
}
#globalNavi ul li {
margin: 0;
padding: 0;
}
#subnavi {
...styles...
}
#subnavi ul li {
...styles...
}
Hope that helps,
Rob
--
Rob Wilmshurst
[EMAIL PROTECTED]
__
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 Rendering Bug?
Sorry about the slow reply; I haven't been able to get online all weekend. I fear you've misinterpreted the problem (or I worded the original post badly, which is more likely :). The CSS works fine; there is no problem with the page I'm using. The example I gave previously was the bare minimum markup and CSS to recreate this rendering bug (I'm calling it a bug, for simplicity's sake). The last tag on the page contains only asterisks, and you can see in the screen shot (and hopefully the example, in IE) that these asterisks are rendered *outside* of the select box, in addition to being rendered correctly inside it. Furthermore, interacting with these extra asterisks has the same consequences as interacting with the tag itself, proving that the two are one and the same element. I was just curious to know if this issue (drop down contents appearing elsewhere on the page in IE) has been raised before, and if not, to point it out. So, has anybody seen this bug 'in the wild'? I need to know or it'll be irritating me all week ;) Cheers, Rob __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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 Rendering Bug?
Ian Young wrote: > You might want to have a look at these as something more fundamental is > going on here. The Firefox issue was because the width of the was set to 0, forcing the elements to stack on top of each other (although this only happened in FF2, not 1.5 for me). I've updated the example to fix this, but the IE problem remains. Thanks for pointing this out though Ian; I hadn't looked in FF 2. The full page is currently living on our internal server; I'll try and get it public-facing ASAP. It certainly seems this is something to do with the way IE handles floats; inserting a after the last tags fixes things... very strange. Rob __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] IE Rendering Bug?
Hi all,
I've come across a strange rendering glitch in IE (apologies if this is
a known issue; google has failed me today).
I'm seeing this in IE7 (full install) and IE6 (standalone, so it can't
really be trusted).
The test case can be seen at
<http://fifteenoclock.com/bla/selectbug.html> and
<http://fifteenoclock.com/bla/selectbug.png>. Obviously, I've trimmed
things down to the bare minimum in terms of CSS and markup...
Basically, IE is rendering the last {x} letters from the last
tag of the last on the page, where {x} is the number of
s on the page minus 1.
So in this case, there are five s and four letters being displayed.
Removing
"form div { width: 1px; }" (any width, even 0, will cause this glitch)
from the CSS fixes things, as does removing
"form select { float: left; }".
Removing
"form label { float: left; }" causes the second-to-last 's value
to be displayed instead!
If anybody can shed light on this, it'd be much appreciated.
And if the above is completely unintelligible, I'll try and explain a
bit better :)
Cheers,
Rob
--
Rob Wilmshurst
[EMAIL PROTECTED]
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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] display block a hover menu problem
Sander van Surksum wrote:
> The problem is that the a hover takes the padding from the normal h3 selector
> and I
> think that why he isn't changing the whole background on a hover.
If you remove the padding from the and apply it to the , the
entire background will change. That's fine if all of the list elements
are going to be links.
h3 { ... padding: 0; ... }
a { ... padding: 4px 0 0 8px; }
If you want to keep some non-link elements there, then you'll need to
keep the padding inside the and use negative margins to line the
s up:
h3 { ...
padding: 4px 0 0 8px;
...}
a { ...
padding: 4px 0 0 8px;
margin: -4px 0 0 -8px;
...}
This second example is probably better as it allows you the flexibility
to unlink text at a later date.
I've tested this in Firefox 1.5 without any problems; I can't test in IE
at the moment because I've broken it (stupid multiple IE installs :) but
it should work OK.
-Rob
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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] display block a hover menu problem
Sander,
The main problem is that you're applying the display:block to the :hover
section:
#navcontainer h3 a:hover {
...
display: block;
text-decoration: none;
...
}
This needs to be moved to the 'a' selector:
#navcontainer h3 a {
...
display: block;
...
}
That allows you to apply the width to the element, making the whole
thing clickable.
Are the links meant to be slightly off-center like they are?
- Rob
--
Rob Wilmshurst
[EMAIL PROTECTED]
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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] css challenge: frameset style browser height stretching page
> Here's the trick: when the body is longer than the browser window, I > want the body to have a scrollbar, kinda like when you have a div with > a set height and auto overflow. Roger Johansson published something similar to this a few days ago; it's an update of quite an old technique: http://www.456bereastreet.com/archive/200609/css_frames_v2_fullheight/ The example: http://www.456bereastreet.com/lab/css-frames-v2/example-2/ Is that what you're after? Regards, Rob -- Rob Wilmshurst [EMAIL PROTECTED] __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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 7 and IE 6 Installs
Ooh, I was waiting for that standalone RC1 release. I'm currently working the other way round, with a standalone IE6 from here: http://browsers.evolt.org/download.php?/ie/32bit/standalone/ie6eolas_nt.zip and an installed IE7. It's pretty painful though, as the IE version is changed in the registry every time you launch either version -- hours of fun! Standalone IE7 is the easier way round I think, but I'm slightly wary as to its accuracy compared with a full install. -- Rob Wilmshurst [EMAIL PROTECTED] __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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/
