Re: [css-d] Suckerfish blues (again)
Chris Akers wrote: http://homepage.ntlworld.com/graham.reeds/space Also, I noticed that #nav-rankings-option2a and #nav-rankings-option3a's background image jump up a pixel or two on hover. That is due to me not bothering with lining up the selection's properly. I can't decide whether the line under the link should line up with the bottom of the graphics text or just underneath that halfway between the options. Any ideas on that? Halfway between definitely. Also, why are you using blank LI's for the top and bottom? It seems you could just ditch those non-semantic items and make the first and last LI's larger to accommodate the background. There was a very good reason for doing that which escapes me at this moment in time. I think it was something to do with IE dropping the menu's if I didn't have it. Also the menu item would appear selected when the pointer was over the top of the border - an effect that looked wrong. Thanks, G. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Suckerfish blues (again)
Chris Akers wrote:
The original problem is the fact that I had to reduce the size of the
text via font-size: 1px to get it to render properly on IE6. To me
that seems rather hacky and I was wondering if there was any more
elegant way of achieving this.
Try
#nav li {
float: left;
overflow: hidden;
}
That should be less hacky. (If it works at all.)
That is definately less hacky and it works in IE6 and FF. Thank you.
Now I need to modify the graphics so that all menu tops are 5 (or 6) px
in height and create a couple of classes for top and bottom and then I
will be sorted (nearly).
Also, I noticed that #nav-rankings-option2a and
#nav-rankings-option3a's background image jump up a pixel or two on
hover.
That is due to me not bothering with lining up the selection's properly. I
can't decide whether the line under the link should line up with the bottom of
the graphics text or just underneath that halfway between the options. Any
ideas on that?
[OT]: Are there any lists similar to this that deal with JavaScript?
comp.lang.javascript[1] is a fairly good usenet group. There are a few
characters there that would rather critique your post format than
actually help or get into javascript holy wars with each other. But if
you can ignore them then it is a knowledgeable resource.
Thanks. I will check there. I am surprised that gmane doesn't have a
purely javascript group on here.
Thanks to all.
G.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Suckerfish blues (again)
http://homepage.ntlworld.com/graham.reeds/space Also, I noticed that #nav-rankings-option2a and #nav-rankings-option3a's background image jump up a pixel or two on hover. That is due to me not bothering with lining up the selection's properly. I can't decide whether the line under the link should line up with the bottom of the graphics text or just underneath that halfway between the options. Any ideas on that? Halfway between definitely. Also, why are you using blank LI's for the top and bottom? It seems you could just ditch those non-semantic items and make the first and last LI's larger to accommodate the background. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Suckerfish blues (again)
what are the problems? All that I can see is that the link text is not
being hidden...anything else?
to hide the text, you'll need to edit the markup:
lia href=#blink/b/a/li
and the css, accordingly:
li a b {visibility:hidden;}
- CSS Student
On 10/31/05, Vicki Stebbins [EMAIL PROTECTED] wrote:
At 11:26 AM 31/10/2005, Graham Reeds wrote:
I have implemented a suckerfish menu for a redesign of a game site.
However every implementation I come up with works fine in FF and Opera8,
but fails in IE6 (only tested on Windows).
I also used the block image code which I was having trouble with last
week (thanks for the help).
The test site is here: http://homepage.ntlworld.com/graham.reeds/space
and the css is here
http://homepage.ntlworld.com/graham.reeds/space/styles/space_styles.css
...
Thanks, Graham Reeds.
Hi Graham,
I have to say I got so frustrated with the suckerfish menu I bought
Eric Meyer's Book 'More Eric Meyers on CSS' and implemented his menu (easy
and worked well), it also had how to do an image gallery which was perfect
for the job I was working on.
I was pointed to the book by Kev Adamson http://www.kevadamson.com, he had
used it in the sites he designed.
Regards
Vicki
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
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
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Suckerfish blues (again)
css.student wrote:
what are the problems? All that I can see is that the link text is not
being hidden...anything else?
to hide the text, you'll need to edit the markup:
lia href=#blink/b/a/li
and the css, accordingly:
li a b {visibility:hidden;}
- CSS Student
On 10/31/05, Vicki Stebbins [EMAIL PROTECTED] wrote:
At 11:26 AM 31/10/2005, Graham Reeds wrote:
I have implemented a suckerfish menu for a redesign of a game site.
However every implementation I come up with works fine in FF and Opera8,
but fails in IE6 (only tested on Windows).
I also used the block image code which I was having trouble with last
week (thanks for the help).
The test site is here: http://homepage.ntlworld.com/graham.reeds/space
and the css is here
http://homepage.ntlworld.com/graham.reeds/space/styles/space_styles.css
...
Thanks, Graham Reeds.
Hi Graham,
I have to say I got so frustrated with the suckerfish menu I bought
Eric Meyer's Book 'More Eric Meyers on CSS' and implemented his menu (easy
and worked well), it also had how to do an image gallery which was perfect
for the job I was working on.
I was pointed to the book by Kev Adamson http://www.kevadamson.com, he had
used it in the sites he designed.
Regards
Vicki
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
The original problem is the fact that I had to reduce the size of the
text via font-size: 1px to get it to render properly on IE6. To me
that seems rather hacky and I was wondering if there was any more
elegant way of achieving this. If you look at the test page now it is
coming to life a lot more, and the menus work (or they should).
Also I have a problem in that when I upload the page to an actual site
and not the IIS that is on my local box the page is excrutiatingly slow
in IE6 yet smooth as silk in Opera and FF. Pop into the room next to
mine and it runs fine in his IE6. I think this is a IIS local-external
thing going on.
Also I have had another one of my friends test it on his Mac and it
works fine apparently.
[OT]: Are there any lists similar to this that deal with JavaScript? I
now have a couple of JS problems and my knowledge of JS is more limited
than my knowledge of CSS...
G.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Suckerfish blues (again)
The original problem is the fact that I had to reduce the size of the
text via font-size: 1px to get it to render properly on IE6. To me
that seems rather hacky and I was wondering if there was any more
elegant way of achieving this.
Try
#nav li {
float: left;
overflow: hidden;
}
That should be less hacky. (If it works at all.)
Also, I noticed that #nav-rankings-option2a and
#nav-rankings-option3a's background image jump up a pixel or two on
hover.
[OT]: Are there any lists similar to this that deal with JavaScript?
comp.lang.javascript[1] is a fairly good usenet group. There are a few
characters there that would rather critique your post format than
actually help or get into javascript holy wars with each other. But if
you can ignore them then it is a knowledgeable resource.
[1] http://groups.google.com/group/comp.lang.javascript
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Suckerfish blues (again)
Graham,
An alternative I have used is to look at the original suckerfish dropdown
which gives a drowp-down background image and intergrate it into the revised
suckerfish model. You need to create a class for the 'parent' items and
another for the 'child' items.
This works in most browsers but not IE5-Mac.
These are the main changes:
#nav li ul { /*second level lists */
{suckerfish dropdown ingredients +
BACKGROUND: url(../images/ddbg.gif) top left no-repeat;
/* background image of the drop down list. */
padding: 0px 0px 60px 0px;
#nav li.daddy {
position: relative;
width: 110px;
w\idth: 110px;
BACKGROUND: /* a url or in your case color black. */
z-index: 6;
font-size: 9px;
color: black;
}
#nav li li.son {
position: relative;
display: block;
text-align: left;
BACKGROUND: none;
line-height: 20px;
margin-left: 0px;
padding-left: 0px;
Please see http://www.ekstasis.net/blog/blog.php for a working example.
On 10/31/05, Graham Reeds [EMAIL PROTECTED] wrote:
I have implemented a suckerfish menu for a redesign of a game site.
However every implementation I come up with works fine in FF and Opera8,
but fails in IE6 (only tested on Windows).
I also used the block image code which I was having trouble with last
week (thanks for the help).
The test site is here: http://homepage.ntlworld.com/graham.reeds/space
and the css is here
http://homepage.ntlworld.com/graham.reeds/space/styles/space_styles.css
Originally I grouped all the menu images into one. This partially
worked, but had problems with the items being differing heights: The
items were between 13 and 21 pixels in size but the items were only
partially selectable because the text doesn't fill it entirely.
So I then thought about adding a top and bottom li for the menu border
and making all the items in between the same size. However this causes
the top (and the bottom) image to be drawn in correctly due to IE
deciding that the size you want it be cannot be any smaller than the
font-size (in this case around 10px). Add font-size: 5px to the top
list-item and a similar one to the bottom and it starts to render
correctly in IE, FF and O8.
Now I am happy that it is rendering correctly, but am unhappy about the
hack. Why does it do this and is there a cleaner work around?
Also I have noticed that it is very slow updating when I am checking the
site when hosted on my homepage. Does anyone else see this sluggishness
in IE6? Any ideas on that as well?
Thanks, Graham Reeds.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org http://evolt.org --
http://www.evolt.org/help_support_evolt/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Suckerfish blues (again)
At 11:26 AM 31/10/2005, Graham Reeds wrote: I have implemented a suckerfish menu for a redesign of a game site. However every implementation I come up with works fine in FF and Opera8, but fails in IE6 (only tested on Windows). I also used the block image code which I was having trouble with last week (thanks for the help). The test site is here: http://homepage.ntlworld.com/graham.reeds/space and the css is here http://homepage.ntlworld.com/graham.reeds/space/styles/space_styles.css ... Thanks, Graham Reeds. Hi Graham, I have to say I got so frustrated with the suckerfish menu I bought Eric Meyer's Book 'More Eric Meyers on CSS' and implemented his menu (easy and worked well), it also had how to do an image gallery which was perfect for the job I was working on. I was pointed to the book by Kev Adamson http://www.kevadamson.com, he had used it in the sites he designed. Regards Vicki __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Suckerfish blues (again)
I have implemented a suckerfish menu for a redesign of a game site. However every implementation I come up with works fine in FF and Opera8, but fails in IE6 (only tested on Windows). I also used the block image code which I was having trouble with last week (thanks for the help). The test site is here: http://homepage.ntlworld.com/graham.reeds/space and the css is here http://homepage.ntlworld.com/graham.reeds/space/styles/space_styles.css Originally I grouped all the menu images into one. This partially worked, but had problems with the items being differing heights: The items were between 13 and 21 pixels in size but the items were only partially selectable because the text doesn't fill it entirely. So I then thought about adding a top and bottom li for the menu border and making all the items in between the same size. However this causes the top (and the bottom) image to be drawn in correctly due to IE deciding that the size you want it be cannot be any smaller than the font-size (in this case around 10px). Add font-size: 5px to the top list-item and a similar one to the bottom and it starts to render correctly in IE, FF and O8. Now I am happy that it is rendering correctly, but am unhappy about the hack. Why does it do this and is there a cleaner work around? Also I have noticed that it is very slow updating when I am checking the site when hosted on my homepage. Does anyone else see this sluggishness in IE6? Any ideas on that as well? Thanks, Graham Reeds. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Suckerfish blues (again)
Bill Gates wrote: I don't know whether you care or not, but it doesn't work right on OS X, Firefox or Opera. IE5.2 is hopeless, as well. On Oct 30, 2005, at 7:26 PM, Graham Reeds wrote: http://homepage.ntlworld.com/graham.reeds/space Is that on just the 'main' menu or you saying for all of them? Only the main menu has been implemented. No point in coding up the rest until I have one of them working. Really I would like a fix or a more elegant workaround for the font-size hack, and why IE6 is really slow compared to FF and Opera when the page is remote. Also do other people see it as being really slow. Also I don't really care about any browser less than a couple of years old, and IE5.x on both Mac and Windows is really a dying breed. For Mac I only really care about Safari, FF Opera, but I don't have access to a Mac for continuous testing, so I hope that FF and Opera will be like their Windows counterparts. Safari, I hope, will be quite compliant (it seems to be) so I hope the rendering will be similar to FF (and therefore work). Thanks, Graham. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Suckerfish blues (again)
Linda H wrote: IE5.x on both Mac and Windows is really a dying breed. Don't I wish! Unfortunately, some 95% of the people accessing the site I'm working on are using IE and the people in charge don't take kindly to me telling the users they should download Firefox in response to complaints :-( Linda H Let me get this straight. 95% of people accessing your site use IE5.5 or less on both Windows and Mac, so the remaining 5% is distributed amongst IE6, FF, Opera, Safari, etc.? Last time I checked 95% of users used IE6 FF. The remaining 5% is distributed amongst IE5 (the most at around 3%) and Safari, Opera being the more significant of the others. G. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
