[css-d] Linked image showing style
Why can't I get rid of the background that shows up when I hover on the bottom image of this page [the schooner]. I haven't been able to figure this out. Help greatly appreciated. http://www.weiboyz.com/ivanstuff/chesapeake/ -- Kim Brooks Wei http://thewei.com T 201.475.1854 __ 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] Linked image showing style
-BEGIN PGP SIGNED MESSAGE-
Hash: SHA1
On Sun 25 March 2007 10:13, Kim Brooks Wei wrote:
Why can't I get rid of the background that shows up when I hover on
the bottom image of this page [the schooner]. I haven't been able to
figure this out. Help greatly appreciated.
http://www.weiboyz.com/ivanstuff/chesapeake/
It is because you set a background color for a:hover. If you make a definition
like:
a.img:hover { background: transparent; }
and change the link to:
a class=img href=http://johnsmith400.org;img
src=http://weiboyz.com/grfxivan/chesapeakepix/smithschooner.png; alt=smith
schooner //a
then it works here.
- --
Med venlig hilsen / Best regards
Thomas Olsen
That that is is that that is not is not.
-BEGIN PGP SIGNATURE-
Version: GnuPG v1.4.2.2 (GNU/Linux)
iD8DBQFGBkqKWNiChDCP5GkRAkK+AJ4+mGVUj2EVT0QYGUoYwXu775JYKgCfbJv8
0IlZhzgB6Ex4S0Dn/fOuIZo=
=0oZO
-END PGP SIGNATURE-
__
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] Linked image showing style
On Sun, 25 Mar 2007, Kim Brooks Wei wrote:
Why can't I get rid of the background that shows up when I hover on
the bottom image of this page [the schooner].
...
http://www.weiboyz.com/ivanstuff/chesapeake/
What puzzles me is why Firefox shows just a colored bar under the image on
mouseover, whereas IE shows bars on all sides (like a frame). The latter
behavior is at least superficially more in accordance with CSS
specifications (strangely enough), since you have the rule
img {
padding: 16px;
border: none;
}
and the rule
a:hover { color: white; background: #809cb8;
}
When you hover the image, you also hover the enclosing a element, making
its background colored. The background of the image is transparent (as
explicitly set in your stylesheet), so the background of the a element
shines thru.
Adding, for example,
.imgcenter a { background: transparent; }
would remove the effect. I guess this is what you want, though it implies
that there is no visual clue of the image being a link, even on mouseover,
except the change of the pointer (cursor) shape and the eventual
appearance of an address on the status line.
--
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] image replacement with links in IE
On 24 Mar 2007, at 21:55, brian wrote:
.ImageReplace, .ImageReplace li { letter-spacing: -1000em !important;
background-repeat: no-repeat;}
If you had the following mark up:
ul class=imageReplace
lia href=Home/a/li
/ul
Would now the UL be shifted 1000em left, closely followed by the LI
inside the UL?
Traditionally the mark-up for IR tends to be something like:
ul
lia href= class=imageReplace id=homeLinkHome/a/li
/ul
Styling (including PNG replacement):
.imageReplace {
text-indent: -1000em;
background-repeat: no-repeat;
display: block; /* important for IE to make it respect width/
height */
}
#homeLink {
width: width_of_image;
height: height_of_image;
text-decoration: none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader
(enabled=true, sizingMethod=scale, src='/image.png');
}
#homeLink[imageReplace] {
background-image: url(path/to/image.ext);
}
To make the CSS validate you may need to remove the filter to an
external CSS file referenced via a conditional comment.
Referenced PNG hack from:
http://www.daltonlp.com/view/217
__
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] Linked image showing style
On Mar 25, 2007, at 7:13 PM, Jukka K. Korpela wrote:
http://www.weiboyz.com/ivanstuff/chesapeake/
What puzzles me is why Firefox shows just a colored bar under the
image on
mouseover, whereas IE shows bars on all sides (like a frame). The
latter
behavior is at least superficially more in accordance with CSS
specifications (strangely enough), since you have the rule
img {
padding: 16px;
border: none;
}
and the rule
a:hover { color: white; background: #809cb8;
}
When you hover the image, you also hover the enclosing a element,
making
its background colored. The background of the image is transparent (as
explicitly set in your stylesheet), so the background of the a
element
shines thru.
But a is an inline element and it's line-box shouldn't be affected
by the dimensions of the image.
Gecko, Webkit, Opera, Konqueror, iCab all behave the same way, btw.
It is the same as span xxx emyyy/emzzz/span
http://dev.l-c-n.com/_temp/tmp-span-em.html
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] Linked image showing style
From: Kim Brooks Wei [EMAIL PROTECTED]
Why can't I get rid of the background that shows up when I hover on
the bottom image of this page [the schooner]. I haven't been able to
figure this out. Help greatly appreciated.
http://www.weiboyz.com/ivanstuff/chesapeake/
Have you tried -
.imgcenter img {vertical-align: bottom;}
to remove the space left for text descenders?
Worked in Firefox, anyway. Didn't test anywhere else
~holly
__
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] Linked image showing style
On 25 Mar 2007, at 12:12, Philippe Wittenbergh wrote:
But a is an inline element and it's line-box shouldn't be affected
by the dimensions of the image.
Gecko, Webkit, Opera, Konqueror, iCab all behave the same way, btw.
It is the inline nature of the IMG that's making the BG colour shine
through.
Try this CSS:
.imgcenter a img {
display: block; /* removes background issues */
margin: 0 auto; /* centres image, as text-align will no longer
work */
}
__
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] More Testing: cssframes / sliding drop downs / rounded tabs / Testing / Please / Thank You /
Steven Tchorzewski wrote: Anyways, It makes a very clean site, with sifr headlines ( http://www.mikeindustries.com/sifr/ ); that make it easy to change the flash font, all the container sizes. Then just replace images and you can really change everything about it, pretty quickly. I still consider it a beta version, really, and I am hoping to find some help with it by giving it away. AIM_2PC (v1.0) http://www.marketingcms.com/ Thanks in advance, for the browser compatibility testing, I really There are several zillion screen captures (159) here http://www.browsercam.com/public.aspx?proj_id=334514. An ambitious project. The layout structure is too rigid for (my) humble needs. I think you may need to take into consideration that not eveyone runs flash (crashes IE6.0 and .7.0 and does a number on Opera/9.1). 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] image replacement with links in IE
Bradley Wright wrote:
On 24 Mar 2007, at 21:55, brian wrote:
.ImageReplace, .ImageReplace li { letter-spacing: -1000em !important;
background-repeat: no-repeat;}
If you had the following mark up:
ul class=imageReplace
lia href=Home/a/li
/ul
Would now the UL be shifted 1000em left, closely followed by the LI
inside the UL?
The ULs LIs are absolutely positioned.
Traditionally the mark-up for IR tends to be something like:
...
To make the CSS validate you may need to remove the filter to an
external CSS file referenced via a conditional comment.
I should have been more clear in my query. I have PNG transparency
working in IE--i've done this many times before. What i'm hung up on
right now is trying to find one method which allows for the replaced
elements to also be links.
As for which method i'm using, this is how i would generally handle it
(though i've tried several others for this site):
-- normal css file --
#en_about, #en_about_on
{
left: 10px;
top: 40px;
width: 43px;
height: 22px;
background-image: url('/images/nav/en/about.png');
}
#en_about_on, #en_about:hover
{
background-image: url('/images/nav/en/about_on.png');
}
-- ie-only css file (using CC) --
#en_about, #en_about_on
{
background: none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(
src='/images/nav/en/about.png',sizingMethod='image');
height: 22px;
voice-family: \}\; voice-family: inherit;
height: 0px;
}
#en_about_on, #en_about:hover
{
background: none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(
src='/images/nav/en/about_on.png',sizingMethod='image');
height: 22px;
voice-family: \}\; voice-family: inherit;
height: 0px;
}
The problem lies in the fact that these are also links. The
AlphaImageLoader filter is keeping the links from being clickable.
I'm sure there must be a CSS-only solution out there, but i'm also open
to any ideas involving javascript (hey--it's still a CSS issue though).
Last night i wrote up some javascript that would create a new image
object based on the source of the background image, place it inside the
link, then remove the BG image. My reasoning was that IE seems to be
able to deal with having a link around a transparent image element[1],
just not so much for background images. I think i'm close to something
that works, but i'd really like to not have to do this.
Why is the world's worst browser also the worst to debug?
[1] If one also treats the page's PNGs properly upon page load:
http://boring.youngpup.net/_projectDirectories/sleight/sleight.js
brian
__
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] image replacement with links in IE
brian wrote: ... I'm working on a site that uses a lot of transparent PNGs for the navigation. Obviously, this requires that i use the AlphaImageLoader filter for IE. However, i'm struggling to come up with a replacement method that will also ensure that the links are clickable. ... Right. You can see the design at www.semprinirecords.com This is a link to a page where the problem does not show up. Anyway, links are not clickable when placed above a filter in IE. Worse, if placed above a filter when positioned. Both situations are adressed here: http://www.satzansatz.de/cssd/tmp/alphatransparency.html 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/
[css-d] positionning problem
Hi,
been the whole day I try something very basic ...
I have two input fields :
#login_field_user {
background-color: blue;
margin-bottom:3px;
}
#login_field_pwd {
background-color:green;
margin-bottom:3px;
}
inside a div :
#login_fields {
float:right;
margin-right:8px;
background-color:red;
}
Actually I try to get this :
3px
login text field (14px)
3px
password text field (14px)
3px
But I just can't achieve this.
Here is the site :
http://matthew16.free.fr/portfolio/
I can notice in Mozilla that the
I can notice that
#login_fields is not taking a
__
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] Perfect font sizes across all browser - solved?
Hi all
This weekend I've been working on a way of getting complete control
over font sizes without IE's text-resize shrinking text beyond all
readable sizes.
What I discovered was:
px - perfect control using px's to define font sizes, however
prevents IE/Win from text resizing.
em - almost perfect control using em, although when text-resizing in
IE/Win to small and extra small can cause unreadibility.
keywords - less than perfect control, however IE/Win never text-
resizes smaller than 9px.
So while playing around with various options, I discovered a way that
we might be able to fix IE/Win's text-resizing problems while still
having 'almost' perfect control over font sizes.
My solution at presents includes:
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml; xml:lang=en lang=en
head
meta http-equiv=Content-Type content=text/html; charset=utf-8/
titleTest Resize/title
style type=text/css media=screen
html {
/* prevents IE shrinking font-size beyond readable size */
font: normal small/1.5 Lucida Grande, Lucida, Verdana, sans-serif;
}
/style
script type=text/javascript
var fontSize = 0.95em
function fontResize() {
if (!document.getElementsByTagName) return false;
var bodyElement = document.getElementsByTagName(body)[0];
bodyElement.style.fontSize = fontSize;
}
window.onload = fontResize;
/script
/head
body
h3H3 - Heading/h3
pLorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi
pellentesque interdum augue. Aenean a ante. Pellentesque ut nulla in
dui lacinia ultricies. Nam nibh metus, venenatis nec, eleifend non,
feugiat non, nibh. Maecenas commodo fermentum magna. Duis tincidunt
viverra sem. Donec id orci./p
/body
/html
I understand the solution involves using javascript to achieve a
solution, however when the document is viewed by browsers that do not
support the DOM, it simply reverts back the 'small' keyword, which is
only a fraction larger than the font-size we're defining in the
javascript. So understandably, you'd select the closest size keyword
to the default font-size you're allocating in the javascript.
I believe the solution fixes the IE/Win text resizing issue, while
providing control over our default font size.
I'd be interested in hearing anyones results / bugs / opinions about
this.
Cheers
Lee Powell
__
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] Perfect font sizes across all browser - solved?
Lee Powell wrote: I believe the solution fixes the IE/Win text resizing issue, while providing control over our default font size. This text resizing issue... http://www.gunlaug.no/contents/wd_additions_13.html ...? Note that the bug gets re-triggered if font-size keywords are used anywhere in a document. The bug is then inherited by the children. I'd be interested in hearing anyones results / bugs / opinions about this. Dump all keywords and size fonts in percentage or em, on a base-font in percentage - 100% on html is fine. 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] Perfect font sizes across all browser - solved?
At 3/25/2007 02:01 PM, Lee Powell wrote: This weekend I've been working on a way of getting complete control over font sizes without IE's text-resize shrinking text beyond all readable sizes. What I discovered was: px - perfect control using px's to define font sizes, however prevents IE/Win from text resizing. em - almost perfect control using em, although when text-resizing in IE/Win to small and extra small can cause unreadibility. keywords - less than perfect control, however IE/Win never text- resizes smaller than 9px. So while playing around with various options, I discovered a way that we might be able to fix IE/Win's text-resizing problems while still having 'almost' perfect control over font sizes. My solution at presents includes: !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd; H3 - Heading Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi pellentesque interdum augue. Aenean a ante. Pellentesque ut nulla in dui lacinia ultricies. Nam nibh metus, venenatis nec, eleifend non, feugiat non, nibh. Maecenas commodo fermentum magna. Duis tincidunt viverra sem. Donec id orci. I understand the solution involves using javascript to achieve a solution, however when the document is viewed by browsers that do not support the DOM, it simply reverts back the 'small' keyword, which is only a fraction larger than the font-size we're defining in the javascript. So understandably, you'd select the closest size keyword to the default font-size you're allocating in the javascript. I believe the solution fixes the IE/Win text resizing issue, while providing control over our default font size. Hi Lee, I'd like to read and respond to your technique but I can't see any javascript in the source code for your email, presumably stripped out by virus protection or email client. Please post your example on a server and post its URL. Embedding examples of HTML and active javascript in email is probably always a mistake... If your technique depends on javascript, I suggest that it isn't merely browsers that don't support the DOM that won't execute it but also modern browsers with scripting turned off, whether by user preference, corporate mandate, or other reasons. I mention this merely to indicate that the population your technique excludes is probably larger than you imagine. Regards, Paul __ Paul Novitski Juniper Webcraft Ltd. http://juniperwebcraft.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] Perfect font sizes across all browser - solved?
Paul Novitski wrote: At 3/25/2007 02:01 PM, Lee Powell wrote: This weekend I've been working on a way of getting complete control over font sizes without IE's text-resize shrinking text beyond all readable sizes. What I discovered was: px - perfect control using px's to define font sizes, however prevents IE/Win from text resizing. em - almost perfect control using em, although when text-resizing in IE/Win to small and extra small can cause unreadibility. keywords - less than perfect control, however IE/Win never text- resizes smaller than 9px. So while playing around with various options, I discovered a way that we might be able to fix IE/Win's text-resizing problems while still having 'almost' perfect control over font sizes. My solution at presents includes: !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd; H3 - Heading Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi pellentesque interdum augue. Aenean a ante. Pellentesque ut nulla in dui lacinia ultricies. Nam nibh metus, venenatis nec, eleifend non, feugiat non, nibh. Maecenas commodo fermentum magna. Duis tincidunt viverra sem. Donec id orci. I understand the solution involves using javascript to achieve a solution, however when the document is viewed by browsers that do not support the DOM, it simply reverts back the 'small' keyword, which is only a fraction larger than the font-size we're defining in the javascript. So understandably, you'd select the closest size keyword to the default font-size you're allocating in the javascript. I believe the solution fixes the IE/Win text resizing issue, while providing control over our default font size. Hi Lee, I'd like to read and respond to your technique but I can't see any javascript in the source code for your email, presumably stripped out by virus protection or email client. Please post your example on a server and post its URL. Embedding examples of HTML and active javascript in email is probably always a mistake... If your technique depends on javascript, I suggest that it isn't merely browsers that don't support the DOM that won't execute it but also modern browsers with scripting turned off, whether by user preference, corporate mandate, or other reasons. I mention this merely to indicate that the population your technique excludes is probably larger than you imagine. Also, I wonder what happens when a visitor with Javascript enabled has a minimum font size set larger than whatever value your Javascript calculates? Personally, I think that no site designer can pick a perfect web size because the perfect size depends on the vision, display and preferences of the VISITOR. -- David [EMAIL PROTECTED] authenticity, honesty, community __ 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] Perfect font sizes across all browser - solved?
david wrote: Paul Novitski wrote: At 3/25/2007 02:01 PM, Lee Powell wrote: This weekend I've been working on a way of getting complete control over font sizes without IE's text-resize shrinking text beyond all readable sizes. What I discovered was: px - perfect control using px's to define font sizes, however prevents IE/Win from text resizing. em - almost perfect control using em, although when text-resizing in IE/Win to small and extra small can cause unreadibility. keywords - less than perfect control, however IE/Win never text- resizes smaller than 9px. So while playing around with various options, I discovered a way that we might be able to fix IE/Win's text-resizing problems while still having 'almost' perfect control over font sizes. My solution at presents includes: !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd; H3 - Heading Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi pellentesque interdum augue. Aenean a ante. Pellentesque ut nulla in dui lacinia ultricies. Nam nibh metus, venenatis nec, eleifend non, feugiat non, nibh. Maecenas commodo fermentum magna. Duis tincidunt viverra sem. Donec id orci. I understand the solution involves using javascript to achieve a solution, however when the document is viewed by browsers that do not support the DOM, it simply reverts back the 'small' keyword, which is only a fraction larger than the font-size we're defining in the javascript. So understandably, you'd select the closest size keyword to the default font-size you're allocating in the javascript. I believe the solution fixes the IE/Win text resizing issue, while providing control over our default font size. Hi Lee, I'd like to read and respond to your technique but I can't see any javascript in the source code for your email, presumably stripped out by virus protection or email client. Please post your example on a server and post its URL. Embedding examples of HTML and active javascript in email is probably always a mistake... If your technique depends on javascript, I suggest that it isn't merely browsers that don't support the DOM that won't execute it but also modern browsers with scripting turned off, whether by user preference, corporate mandate, or other reasons. I mention this merely to indicate that the population your technique excludes is probably larger than you imagine. Also, I wonder what happens when a visitor with Javascript enabled has a minimum font size set larger than whatever value your Javascript calculates? Personally, I think that no site designer can pick a perfect web size because the perfect size depends on the vision, display and preferences of the VISITOR. Sorry, perfect web size should have been perfect FONT size. Just can't type today! -- David [EMAIL PROTECTED] authenticity, honesty, community __ 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] Perfect font sizes across all browser - solved? (verification)
Sorry that you won't receive my reply to your private note. I do not believe in supporting or encouraging the use of such services - because they push the problem of managing YOUR spam off onto other people. Use a mail client with real spam filtering capabilities! Paul Novitski wrote: http://www.spamarrest.com/a2?ZGVmZGDjZmcaoz9gMHObLKqunJxhpaVhL29gByOuqJjtGz92nKEmn2xj Sender Verification Hi, thanks for writing. I'm using a service called Spam Arrest to protect myself from receiving junk mail. Because you're writing to me for the first time, Spam Arrest doesn't know if you're a legitimate correspondent or a spammer. Please click the link below to complete the verification process. You have to do this only once. http://www.spamarrest.com/a2?ZGVmZGDjZmcaoz9gMHObLKqunJxhpaVhL29gByOuqJjtGz92nKEmn2xj You are receiving this message in response to your email to Paul Novitski, a Spam Arrest customer. Spam Arrest requests that senders verify themselves before their email is delivered. When you click the above link, you will be taken to a page with a graphic on it. Simply read the word in the graphic, type it into the form, and you're verified. You have to do this only once per Spam Arrest customer. Below are the complete headers of the message that this email was generated in response to. Return-path: [EMAIL PROTECTED] Envelope-to: [EMAIL PROTECTED] Delivery-date: Sun, 25 Mar 2007 16:50:32 -0700 Received: from ms-smtp-04.socal.rr.com ([66.75.162.136]:50949) by cl35.gs01.gridserver.com with esmtp (Exim 4.50) id 1HVcTk-0002Bp-Sf for [EMAIL PROTECTED]; Sun, 25 Mar 2007 16:50:32 -0700 Received: from [192.168.1.100] (cpe-72-130-225-66.hawaii.res.rr.com [72.130.225.66]) by ms-smtp-04.socal.rr.com (8.13.6/8.13.6) with ESMTP id l2PNoMIQ003920 for [EMAIL PROTECTED]; Sun, 25 Mar 2007 16:50:27 -0700 (PDT) Message-ID: [EMAIL PROTECTED] Date: Sun, 25 Mar 2007 13:50:21 -1000 From: david [EMAIL PROTECTED] Reply-To: [EMAIL PROTECTED] Organization: Alias JJ User-Agent: Icedove 1.5.0.9 (X11/20061220) MIME-Version: 1.0 To: Paul Novitski [EMAIL PROTECTED] References: [EMAIL PROTECTED] [EMAIL PROTECTED] [EMAIL PROTECTED] [EMAIL PROTECTED] In-Reply-To: [EMAIL PROTECTED] Content-Type: text/plain; charset=us-ascii; format=flowed Content-Transfer-Encoding: 7bit X-Virus-Scanned: Symantec AntiVirus Scan Engine X-Spam-Status: score=0.0 tests=none version=3.0.3 X-Spam-Level: * Subject: Re: [css-d] Perfect font sizes across all browser - solved? Received-SPF: pass(hawaii.rr.com: domain of orange.rr.com designates 66.75.162.136 as permitted sender) -- David [EMAIL PROTECTED] authenticity, honesty, community __ 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] Perfect font sizes across all browser - solved?
On 3/25/07, Lee Powell [EMAIL PROTECTED] wrote: Hi all This weekend I've been working on a way of getting complete control over font sizes without IE's text-resize shrinking text beyond all readable sizes. I'd be interested in hearing anyones results / bugs / opinions about this. My opinion is that it is madness. The web is not paper. It never will be paper. The web, in contrast to paper which is inflexible, is flexible and always will be. The user and his browser have ultimate control and basically always will have. Applying paper thinking to the web is akin to someone applying the conventions of radio to TV and wondering why they don't seem to work very well. Watch some early TV sometime and you'll see what I mean. Different media require different approaches. Your technique, if I read right, can be defeated simply by turning Javascript off. And a not inconsiderable minority of users already does this. Learn to compose for the medium, not against it. CSS povides the tools you need to do that. -- Ed Seedhouse __ 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] Perfect font sizes across all browsers ... not solved in this way; but IE-fix is present
Ed Seehouse wrote: On 3/25/07, Lee Powell [EMAIL PROTECTED] wrote: Hi all This weekend I've been working on a way of getting complete control over font sizes without IE's text-resize shrinking text beyond all readable sizes. [...] I'd be interested in hearing anyones results / bugs / opinions about this. My opinion is that it is madness. Hi all, Here I can half agree. The goal of the script was: getting IE to behave as a decent browser. Kind of hack: that's not too bad (if it is working usable in different circumstances) - agree to this intention! But getting complete control over font sizes is a complete other story (and not targeted / accomplished by this script anyway). ;-) The web is not paper. It never will be paper. The web, in contrast to paper [...] This I can agree from my heart. See also: The Graphical Designer and the CSS Zen Guru; a small story about perception. Link http://home.tiscali.nl/developerscorner/guru-1.htm To come back on topic, I've made 3 test pages: 1. Plain setting of the body in em. 2. Pasted Lee's javascript method. 3. The css fix as Georg and others mentioned before. Start is here http://home.tiscali.nl/developerscorner/css-discuss/test-resize-plain.htm. To be seen in IE. - Now everybody can make an independent conclusion. :-) Greetings, francky PS-1: The default font-size (normal browser setting) in these pages is (a) the same in the 3 pages, and (b) much smaller than I should advise to use in real world. I've taken the size of Lee's example - just to make it possible to compare and to see the variation in IE deviation from the medium size. PS-2: There is a lot of material about web font sizing in the Sizing Text pages of the the css-d Wiki. http://css-discuss.incutio.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] Random float drops
On 3/23/07, Gunlaug Sørtun [EMAIL PROTECTED] wrote: Richard Grevers wrote: We are getting random float drops on the newly redesigned http://www.freeparking.co.nz/hosting/ Depends on what full width (100%) is in pixels. What you have now should be more than enough, but you're using the wrong tactic at the moment, and there are a few potential/real problems with wide elements in that page. If you use 'float:left' on the left column and 'float:right' on the right column, you won't need - or even want - a 'margin-right: 3%' on the left column at all. Thanks Gunlaug - in the past, I had shied away from opposing floats, but that was because of haslayout problems, which should now be under control on this site. The google image is too wide for its container. Same in all browsers on narrow windows, but IE6 has narrow window all the time and can't handle overflow, so the container becomes too wide and subsequently breaks the column-width and causes float-drop. Solution: make the image narrower by cutting off white area, and center it. yes, I dealt to that on Friday morning before your reply, but we have a no changes on Fridays policy for the production site. Do Mac users have any problems with the updated page? -- Richard Grevers, New Plymouth, New Zealand Hat 1: Development Engineer, Webfarm Ltd. Hat 2: Dramatic Design www.dramatic.co.nz __ 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] Son of Suckerfish problem in IE7
Hi guys, I've been finding an odd problem with the Son of Suckerfish menu in IE7. I've Googled it extensively, and tried implementing every IE7 fix I came across whether it seemed relevant or not, but I just can't get the problem to go away. You can see it in action if you go to the (extremely bare bones) example I've thrown together here: http://www.frontandback.com.au/test/test.html Mouse over one of the menu items, press the mouse button, but then move the mouse slightly before you release the button. Now shift the mouse across the rest of the top-level menu. All of the sub-menus now refuse to vanish. Has anyone run into this problem before? More importantly, does anyone know of a way to fix it? Cheers, Seona. __ 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] Random float drops
Richard Grevers wrote: On 3/23/07, Gunlaug Sørtun [EMAIL PROTECTED] wrote: Richard Grevers wrote: We are getting random float drops on the newly redesigned http://www.freeparking.co.nz/hosting/ [trimmed] Do Mac users have any problems with the updated page? There are 15 captures here http://www.browsercam.com/public.aspx?proj_id=334605. Fair warning if the client is a nit-picker like me who gets-off on pushing the envelope in XP :-) : Top-nav breaking at +1 (Firefox). Text-overlap on text-size largest when ignoring font-sixes (IE7.0) Text-overlap on text-size largest when ignoring font-sixes, and right column float-drop (IE6.0) 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] Son of Suckerfish problem in IE7
Seona Bellamy wrote:
Hi guys,
I've been finding an odd problem with the Son of Suckerfish menu in IE7.
I've Googled it extensively, and tried implementing every IE7 fix I came
across whether it seemed relevant or not, but I just can't get the problem
to go away.
You can see it in action if you go to the (extremely bare bones) example
I've thrown together here:
http://www.frontandback.com.au/test/test.html
Mouse over one of the menu items, press the mouse button, but then move the
mouse slightly before you release the button. Now shift the mouse across the
rest of the top-level menu. All of the sub-menus now refuse to vanish.
Has anyone run into this problem before? More importantly, does anyone know
of a way to fix it?
It's IE6's old stuck-on-hover bug with the ingredient of a mouse click
as a trigger.
#mainnav li:hover {background-position: 0 0}
fixes it.
IE6 itself does not show this stuck-on-hover phenomenon in
suckerfish-type menus: to process the li:hover on any element, the
sfHover = function() already does register an user event with
onmouseover and applies a new class sfhover to li. So there is no need
for this fix in IE6.
http://www.satzansatz.de/cssd/pseudocss.html#hoverstuck
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] Son of Suckerfish problem in IE7
Ingo Chao schreef:
Seona Bellamy wrote:
Hi guys,
I've been finding an odd problem with the Son of Suckerfish menu in IE7.
I've Googled it extensively, and tried implementing every IE7 fix I came
across whether it seemed relevant or not, but I just can't get the problem
to go away.
You can see it in action if you go to the (extremely bare bones) example
I've thrown together here:
http://www.frontandback.com.au/test/test.html
Mouse over one of the menu items, press the mouse button, but then move the
mouse slightly before you release the button. Now shift the mouse across the
rest of the top-level menu. All of the sub-menus now refuse to vanish.
Has anyone run into this problem before? More importantly, does anyone know
of a way to fix it?
It's IE6's old stuck-on-hover bug with the ingredient of a mouse click
as a trigger.
#mainnav li:hover {background-position: 0 0}
fixes it.
IE6 itself does not show this stuck-on-hover phenomenon in
suckerfish-type menus: to process the li:hover on any element, the
sfHover = function() already does register an user event with
onmouseover and applies a new class sfhover to li. So there is no need
for this fix in IE6.
http://www.satzansatz.de/cssd/pseudocss.html#hoverstuck
Ingo
Hi Seona,
Apart from this, I notice that (while the html is validating) the
css-validator is reporting a I/O error and doesn't go on.
And looking at the code of the page, I see some strange double ##'s in
the conditional comments.
Screenshot
http://home.tiscali.nl/developerscorner/css-discuss/images/doublecross.gif
Maybe this can have some influence too?
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/
