Re: [WSG] help with menu positioning
tee wrote: Tell me, what do you like for Christmas gift ? An internet-connection that is extremely fast and works all the time ;-) (Maybe I'll get one before Christmas, but I'm not holding my breath.) Georg -- http://www.gunlaug.no *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] help with menu positioning
My brain isn't working. I thought I have the answer but it's not
working :-(
http://lotusseedsdesign.com/menu.html
start from the second menu, the hover goes off , but actually the
position for the hover state is correct. I do not understand why the
link's position-x got it wrong starts from #m2 - I have my math
carefully calculated.
Here is the code:
#menu {width:920px;}
#menu ul {margin: 0;padding: 0;}
#menu ul li {float:left;margin-top: 8px;text-align: left;margin-left:
0;}
#menu li a:hover {background-position: left 39px;}
#m1, #m2, #m3, #m4, #m5, #m6, #m7, #m8 { height: 31px;background-
repeat: no-repeat;display:block;border-right: 1px solid #fff;
text-indent: -3000px;}
#m1 {width: 65px; background: url(../images/menu/m1.png);}
#m2 {width: 73px; background: url(../images/menu/m2.png) 65px 0;}
#m3 {width: 163px; background: url(../images/menu/m3.png) 138px 0;}
#m4 {width: 113px; background: url(../images/menu/m4.png) 301px 0;}
#m5 {width: 119px; background: url(../images/menu/m5.png) 414px 0;}
#m6 {width: 109px; background: url(../images/menu/m6.png) 533px 0;}
#m7 {width: 144px; background: url(../images/menu/m7.png) 642px 0;}
#m8 {width: 78px; background: url(../images/menu/m8.png) 786px 0;}
Any pointer is greatly appreciated.
tee
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] help with menu positioning
tee wrote:
My brain isn't working. I thought I have the answer but it's not
working :-(
http://lotusseedsdesign.com/menu.html
Missing base-position...
#menu li a {background-position: left top;}
Georg
--
http://www.gunlaug.no
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] help with menu positioning
On May 13, 2008, at 7:39 AM, Gunlaug Sørtun wrote:
tee wrote:
My brain isn't working. I thought I have the answer but it's not
working :-(
http://lotusseedsdesign.com/menu.html
Missing base-position...
#menu li a {background-position: left top;}
Georg
Georg, thanks for the rescue again, as you have always do :-)
Tell me, what do you like for Christmas gift ?
tee
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] Help with menu
As a reminder, at this point you cannot safely apply widths to any elements that have a border, padding or a margin. In the case you need to apply width adn one of the others mentioned, safest best is to insert a nested div/span with the padding applied etc to break it up. This has long since been a point of confusion for many people, and this simple remedy (although in the long term not the best) proves most effective with todays browsers. Joe Taylor http://sitesbyjoe.com Thierry Koblentz wrote: James O'Neill wrote: I am having problems with a menu that is similar to the Alistapart's hybrid menu. I can not get the width to be consistantly even with the rest of the site and it is not workig in IE or Opera. It works fine in Firebird. I have been beating my head against this for quite a long time. It seems that absolutely positioned widths do not behave as I expect them. Oi! http://twitch.sharkpork.com/_work/Freedom/ Help me Obi-wan you are my only hope Did you give this one a try? http://www.tjkdesign.com/articles/dropdown/demo.asp It is a bit moe accessible. Thierry | www.TJKDesign.com ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Help with menu
Joseph: Interesting. Do you have something that I can reference for this? Thierry: I will take a look at that tonight. Thanks guys!On 11/15/05, Joseph R. B. Taylor [EMAIL PROTECTED] wrote: As a reminder, at this point you cannot safely apply widths to any elements that have a border, padding or a margin.In the case you needto apply width adn one of the others mentioned, safest best is to inserta nested div/span with the padding applied etc to break it up. This has long since been a point of confusion for many people, and thissimple remedy (although in the long term not the best) proves mosteffective with todays browsers.Joe Taylor http://sitesbyjoe.comThierry Koblentz wrote:James O'Neill wrote:I am having problems with a menu that is similar to the Alistapart'shybrid menu. I can not get the width to be consistantly even with the rest of the site and it is not workig in IE or Opera. It works finein Firebird. I have been beating my head against this for quite along time.It seems that absolutely positioned widths do not behave as I expect them. Oi!http://twitch.sharkpork.com/_work/Freedom/ Help me Obi-wan you are my only hope Did you give this one a try?http://www.tjkdesign.com/articles/dropdown/demo.asp It is a bit moe accessible. Thierry | www.TJKDesign.com**The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** **The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help** -- __Bugs are, by definition, necessary. Just ask Microsoft! www.co.sauk.wi.us (Work) www.arionshome.com (Personal)www.freexenon.com (Consulting)__ Take Back the Web with Mozilla Fire Fox http://www.getfirefox.comMaking a Commercial Case for Adopting Web Standardshttp://www.maccaws.org/ Web Standards Project http://www.webstandards.org/Web Standards Grouphttp://www.webstandardsgroup.org/ Guild of Accessible Web Designers http://www.gawds.org/
Re: [WSG] Help with menu
I'm not sure...about a physical reference but here's an example: http://sitesbyjoe.com/box_examples.htm It seems to work flawlessly, and its simplicity makes me feel good about using this approach. It also frees me from having to stick hacks in to try and please the browsers. Joe Taylor http://sitesbyjoe.com James O'Neill wrote: Joseph: Interesting. Do you have something that I can reference for this? Thierry: I will take a look at that tonight. Thanks guys! On 11/15/05, * Joseph R. B. Taylor* [EMAIL PROTECTED] mailto:[EMAIL PROTECTED] wrote: As a reminder, at this point you cannot safely apply widths to any elements that have a border, padding or a margin. In the case you need to apply width adn one of the others mentioned, safest best is to insert a nested div/span with the padding applied etc to break it up. This has long since been a point of confusion for many people, and this simple remedy (although in the long term not the best) proves most effective with todays browsers. Joe Taylor http://sitesbyjoe.com Thierry Koblentz wrote: James O'Neill wrote: I am having problems with a menu that is similar to the Alistapart's hybrid menu. I can not get the width to be consistantly even with the rest of the site and it is not workig in IE or Opera. It works fine in Firebird. I have been beating my head against this for quite a long time. It seems that absolutely positioned widths do not behave as I expect them. Oi! http://twitch.sharkpork.com/_work/Freedom/ Help me Obi-wan you are my only hope Did you give this one a try? http://www.tjkdesign.com/articles/dropdown/demo.asp http://www.tjkdesign.com/articles/dropdown/demo.asp It is a bit moe accessible. Thierry | www.TJKDesign.com http://www.TJKDesign.com ** The discussion list for http://webstandardsgroup.org/ http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** -- __ Bugs are, by definition, necessary. Just ask Microsoft! www.co.sauk.wi.us http://www.co.sauk.wi.us (Work) www.arionshome.com http://www.arionshome.com (Personal) www.freexenon.com http://www.freexenon.com (Consulting) __ Take Back the Web with Mozilla Fire Fox http://www.getfirefox.com Making a Commercial Case for Adopting Web Standards http://www.maccaws.org/ http://www.maccaws.org/ Web Standards Project http://www.webstandards.org/ Web Standards Group http://www.webstandardsgroup.org/ Guild of Accessible Web Designers http://www.gawds.org/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Help with menu
I'm confused at your suggestion, why add extra markup when you just need to use the box model hack in the css http://tantek.com/CSS/Examples/boxmodelhack.html Joseph R. B. Taylor wrote: I'm not sure...about a physical reference but here's an example: http://sitesbyjoe.com/box_examples.htm It seems to work flawlessly, and its simplicity makes me feel good about using this approach. It also frees me from having to stick hacks in to try and please the browsers. Joe Taylor http://sitesbyjoe.com James O'Neill wrote: Joseph: Interesting. Do you have something that I can reference for this? Thierry: I will take a look at that tonight. Thanks guys! On 11/15/05, * Joseph R. B. Taylor* [EMAIL PROTECTED] mailto:[EMAIL PROTECTED] wrote: As a reminder, at this point you cannot safely apply widths to any elements that have a border, padding or a margin. In the case you need to apply width adn one of the others mentioned, safest best is to insert a nested div/span with the padding applied etc to break it up. This has long since been a point of confusion for many people, and this simple remedy (although in the long term not the best) proves most effective with todays browsers. Joe Taylor http://sitesbyjoe.com Thierry Koblentz wrote: James O'Neill wrote: I am having problems with a menu that is similar to the Alistapart's hybrid menu. I can not get the width to be consistantly even with the rest of the site and it is not workig in IE or Opera. It works fine in Firebird. I have been beating my head against this for quite a long time. It seems that absolutely positioned widths do not behave as I expect them. Oi! http://twitch.sharkpork.com/_work/Freedom/ Help me Obi-wan you are my only hope Did you give this one a try? http://www.tjkdesign.com/articles/dropdown/demo.asp http://www.tjkdesign.com/articles/dropdown/demo.asp It is a bit moe accessible. Thierry | www.TJKDesign.com http://www.TJKDesign.com ** The discussion list for http://webstandardsgroup.org/ http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** -- __ Bugs are, by definition, necessary. Just ask Microsoft! www.co.sauk.wi.us http://www.co.sauk.wi.us (Work) www.arionshome.com http://www.arionshome.com (Personal) www.freexenon.com http://www.freexenon.com (Consulting) __ Take Back the Web with Mozilla Fire Fox http://www.getfirefox.com Making a Commercial Case for Adopting Web Standards http://www.maccaws.org/ http://www.maccaws.org/ Web Standards Project http://www.webstandards.org/ Web Standards Group http://www.webstandardsgroup.org/ Guild of Accessible Web Designers http://www.gawds.org/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Help with menu
What you have to remember to do is subtract any margins, padding, and borders
you have defined for
that element. For instance...
div id=onenbsp;/div
div#one {
width:300px;
background-color:#FF;
}
... displays a div that's 300px wide. But if you want to pad it's contents you
need to subtract
the padding (minus 10 for the left and then minus 10 for the right for a total
of 20px)...
div id=onenbsp;/div
div#one {
width:280px;
padding:10px;
background-color:#FF;
}
... the same goes if you add borders...
div id=onenbsp;/div
div#one {
width:278px;
padding:10px;
border:1px solid #00;
background-color:#FF;
}
- Original Message -
From: Joseph R. B. Taylor
To: wsg@webstandardsgroup.org
Sent: Tue, 15 Nov 2005 10:05:24 -0500
Subject: Re: [WSG] Help with menu
I'm not sure...about a physical reference but here's an example:
http://sitesbyjoe.com/box_examples.htm
It seems to work flawlessly, and its simplicity makes me feel good about
using this approach. It also frees me from having to stick hacks in to
try and please the browsers.
Joe Taylor
http://sitesbyjoe.com
James O'Neill wrote:
Joseph: Interesting. Do you have something that I can reference for this?
Thierry: I will take a look at that tonight.
Thanks guys!
On 11/15/05, * Joseph R. B. Taylor* [EMAIL PROTECTED]
mailto:[EMAIL PROTECTED] wrote:
As a reminder, at this point you cannot safely apply widths to any
elements that have a border, padding or a margin. In the case you
need
to apply width adn one of the others mentioned, safest best is to
insert
a nested div/span with the padding applied etc to break it up.
This has long since been a point of confusion for many people, and
this
simple remedy (although in the long term not the best) proves most
effective with todays browsers.
Joe Taylor
http://sitesbyjoe.com
Thierry Koblentz wrote:
James O'Neill wrote:
I am having problems with a menu that is similar to the Alistapart's
hybrid menu. I can not get the width to be consistantly even
with the
rest of the site and it is not workig in IE or Opera. It works fine
in Firebird. I have been beating my head against this for quite a
long time.
It seems that absolutely positioned widths do not behave as I
expect
them. Oi!
http://twitch.sharkpork.com/_work/Freedom/
Help me Obi-wan you are my only hope
Did you give this one a try?
http://www.tjkdesign.com/articles/dropdown/demo.asp
http://www.tjkdesign.com/articles/dropdown/demo.asp
It is a bit moe accessible.
Thierry | www.TJKDesign.com http://www.TJKDesign.com
**
The discussion list for http://webstandardsgroup.org/
http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
--
__
Bugs are, by definition, necessary.
Just ask Microsoft!
www.co.sauk.wi.us http://www.co.sauk.wi.us (Work)
www.arionshome.com http://www.arionshome.com (Personal)
www.freexenon.com http://www.freexenon.com (Consulting)
__
Take Back the Web with Mozilla Fire Fox
http://www.getfirefox.com
Making a Commercial Case for Adopting Web Standards
http://www.maccaws.org/ http://www.maccaws.org/
Web Standards Project
http://www.webstandards.org/
Web Standards Group
http://www.webstandardsgroup.org/
Guild of Accessible Web Designers
http://www.gawds.org/
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
Re: [WSG] Help with menu
Because it is a hack, I tend to use the same technique as Joesph, I think its best to avoid hacks wherever possible. Charlie http://www.bartlettdesign.co.uk On 11/15/05, The Visual Process [EMAIL PROTECTED] wrote: I'm confused at your suggestion, why add extra markup when you just needto use the box model hack in the css http://tantek.com/CSS/Examples/boxmodelhack.htmlJoseph R. B. Taylor wrote: I'm not sure...about a physical reference but here's an example: http://sitesbyjoe.com/box_examples.htm It seems to work flawlessly, and its simplicity makes me feel good about using this approach.It also frees me from having to stick hacks in to try and please the browsers. Joe Taylor http://sitesbyjoe.com James O'Neill wrote: Joseph: Interesting. Do you have something that I can reference for this? Thierry: I will take a look at that tonight. Thanks guys! On 11/15/05, * Joseph R. B. Taylor* [EMAIL PROTECTED] mailto:[EMAIL PROTECTED] wrote: As a reminder, at this point you cannot safely apply widths to any elements that have a border, padding or a margin.In the case you need to apply width adn one of the others mentioned, safest best is to insert a nested div/span with the padding applied etc to break it up. This has long since been a point of confusion for many people, and this simple remedy (although in the long term not the best) proves most effective with todays browsers. Joe Taylor http://sitesbyjoe.com Thierry Koblentz wrote: James O'Neill wrote: I am having problems with a menu that is similar to the Alistapart's hybrid menu. I can not get the width to be consistantly even with the rest of the site and it is not workig in IE or Opera. It works fine in Firebird. I have been beating my head against this for quite a long time. It seems that absolutely positioned widths do not behave as I expect them. Oi! http://twitch.sharkpork.com/_work/Freedom/ Help me Obi-wan you are my only hope Did you give this one a try? http://www.tjkdesign.com/articles/dropdown/demo.asp http://www.tjkdesign.com/articles/dropdown/demo.asp It is a bit moe accessible. Thierry | www.TJKDesign.com http://www.TJKDesign.com ** The discussion list for http://webstandardsgroup.org/ http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** -- __ Bugs are, by definition, necessary. Just ask Microsoft! www.co.sauk.wi.us http://www.co.sauk.wi.us (Work) www.arionshome.com http://www.arionshome.com (Personal) www.freexenon.com http://www.freexenon.com (Consulting) __ Take Back the Web with Mozilla Fire Fox http://www.getfirefox.com Making a Commercial Case for Adopting Web Standards http://www.maccaws.org/ http://www.maccaws.org/ Web Standards Project http://www.webstandards.org/ Web Standards Group http://www.webstandardsgroup.org/ Guild of Accessible Web Designers http://www.gawds.org/ ** The discussion list forhttp://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help The discussion list forhttp://webstandardsgroup.org/See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help**
Re: [WSG] Help with menu
Hmmm I disagree, with the hack you can change it from the one css file in the future, with your method you add unnecessary markup to the xhtml. I'd rather use a hack than have bloated markup. (Although these days I use the conditional comment to separate out style sheets when needed which results in no bloated markup and no hacks.) Charlie Bartlett wrote: Because it is a hack, I tend to use the same technique as Joesph, I think its best to avoid hacks wherever possible. Charlie http://www.bartlettdesign.co.uk On 11/15/05, The Visual Process [EMAIL PROTECTED] wrote: I'm confused at your suggestion, why add extra markup when you just need to use the box model hack in the css http://tantek.com/CSS/Examples/boxmodelhack.html Joseph R. B. Taylor wrote: I'm not sure...about a physical reference but here's an example: http://sitesbyjoe.com/box_examples.htm It seems to work flawlessly, and its simplicity makes me feel good about using this approach.It also frees me from having to stick hacks in to try and please the browsers. Joe Taylor http://sitesbyjoe.com James O'Neill wrote: Joseph: Interesting. Do you have something that I can reference for this? Thierry: I will take a look at that tonight. Thanks guys! On 11/15/05, * Joseph R. B. Taylor* [EMAIL PROTECTED] mailto:[EMAIL PROTECTED] wrote: As a reminder, at this point you cannot safely apply widths to any elements that have a border, padding or a margin.In the case you need to apply width adn one of the others mentioned, safest best is to insert a nested div/span with the padding applied etc to break it up. This has long since been a point of confusion for many people, and this simple remedy (although in the long term not the best) proves most effective with todays browsers. Joe Taylor http://sitesbyjoe.com Thierry Koblentz wrote: James O'Neill wrote: I am having problems with a menu that is similar to the Alistapart's hybrid menu. I can not get the width to be consistantly even with the rest of the site and it is not workig in IE or Opera. It works fine in Firebird. I have been beating my head against this for quite a long time. It seems that absolutely positioned widths do not behave as I expect them. Oi! http://twitch.sharkpork.com/_work/Freedom/ "Help me Obi-wan you are my only hope" Did you give this one a try? http://www.tjkdesign.com/articles/dropdown/demo.asp http://www.tjkdesign.com/articles/dropdown/demo.asp It is a bit moe accessible. Thierry | www.TJKDesign.com http://www.TJKDesign.com ** The discussion list for http://webstandardsgroup.org/ http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** -- __ "Bugs are, by definition, necessary. Just ask Microsoft!" www.co.sauk.wi.us http://www.co.sauk.wi.us (Work) www.arionshome.com http://www.arionshome.com (Personal) www.freexenon.com http://www.freexenon.com (Consulting) __ Take Back the Web with Mozilla Fire Fox http://www.getfirefox.com Making a Commercial Case for Adopting Web Standards http://www.maccaws.org/ http://www.maccaws.org/ Web Standards Project http://www.webstandards.org/ Web Standards Group http://www.webstandardsgroup.org/ Guild of Accessible Web Designers http://www.gawds.org/ ** The discussion list forhttp://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** ** The discussion list forhttp://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Help with menu
The elaborate on Charlie's statement, the hacks will at some point bite us on the rear end. There's a huge possibility we'll be going back and re-fixing those fixes. I'm too lazy to put myself in that position, which is why I chose this profession in the first place. Joe Taylor http://sitesbyjoe.com Charlie Bartlett wrote: Because it is a hack, I tend to use the same technique as Joesph, I think its best to avoid hacks wherever possible. Charlie http://www.bartlettdesign.co.uk On 11/15/05, *The Visual Process* [EMAIL PROTECTED] mailto:[EMAIL PROTECTED] wrote: I'm confused at your suggestion, why add extra markup when you just need to use the box model hack in the css http://tantek.com/CSS/Examples/boxmodelhack.html Joseph R. B. Taylor wrote: I'm not sure...about a physical reference but here's an example: http://sitesbyjoe.com/box_examples.htm It seems to work flawlessly, and its simplicity makes me feel good about using this approach. It also frees me from having to stick hacks in to try and please the browsers. Joe Taylor http://sitesbyjoe.com James O'Neill wrote: Joseph: Interesting. Do you have something that I can reference for this? Thierry: I will take a look at that tonight. Thanks guys! On 11/15/05, * Joseph R. B. Taylor* [EMAIL PROTECTED] mailto:[EMAIL PROTECTED] mailto:[EMAIL PROTECTED] mailto:[EMAIL PROTECTED] wrote: As a reminder, at this point you cannot safely apply widths to any elements that have a border, padding or a margin. In the case you need to apply width adn one of the others mentioned, safest best is to insert a nested div/span with the padding applied etc to break it up. This has long since been a point of confusion for many people, and this simple remedy (although in the long term not the best) proves most effective with todays browsers. Joe Taylor http://sitesbyjoe.com Thierry Koblentz wrote: James O'Neill wrote: I am having problems with a menu that is similar to the Alistapart's hybrid menu. I can not get the width to be consistantly even with the rest of the site and it is not workig in IE or Opera. It works fine in Firebird. I have been beating my head against this for quite a long time. It seems that absolutely positioned widths do not behave as I expect them. Oi! http://twitch.sharkpork.com/_work/Freedom/ Help me Obi-wan you are my only hope Did you give this one a try? http://www.tjkdesign.com/articles/dropdown/demo.asp http://www.tjkdesign.com/articles/dropdown/demo.asp http://www.tjkdesign.com/articles/dropdown/demo.asp It is a bit moe accessible. Thierry | www.TJKDesign.com http://www.TJKDesign.com http://www.TJKDesign.com ** The discussion list for http://webstandardsgroup.org/ http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** -- __ Bugs are, by definition, necessary. Just ask Microsoft! www.co.sauk.wi.us http://www.co.sauk.wi.us http://www.co.sauk.wi.us http://www.co.sauk.wi.us (Work) www.arionshome.com http://www.arionshome.com http://www.arionshome.com (Personal) www.freexenon.com http://www.freexenon.com http://www.freexenon.com (Consulting) __ Take Back the Web with Mozilla Fire Fox http://www.getfirefox.com Making a Commercial Case for Adopting Web Standards http://www.maccaws.org/ http://www.maccaws.org/ http://www.maccaws.org/ Web Standards Project http://www.webstandards.org/ Web Standards Group http://www.webstandardsgroup.org/ Guild of Accessible Web Designers http://www.gawds.org/ ** The discussion list for
Re: [WSG] Help with menu
Charlie Bartlett wrote: Because it is a hack, I tend to use the same technique as Joesph, I think its best to avoid hacks wherever possible. But using an extra DIV like this is also a hack. And not better IMO, since it mixes structure and presentation. My approach is to *not* mix dimensions with padding/border declarations on the same axis. I don't think padding is an issue since it can be moved down to the inner elements. Border is more tricky, but it is always possible to keep the box model in mind and plan ahead when it comes to visual design... Thierry | www.TJKDesign.com ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Help with menu
The reason I use this technique rather that the box model hack, is because we cannot guarantee that the box model hack will work in future browsers, I know its probably not going to be a big deal to fix it, knocking out a couple of lines of css shouldn't take long, but I prefer not to have clients moaning at me because their sites have suddenly stopped working. This technique is far more future proof, and allthough its not semantically perfect, i prefer it to having unnecessary voice selectors in your style sheet. On 11/15/05, Thierry Koblentz [EMAIL PROTECTED] wrote: Charlie Bartlett wrote: Because it is a hack, I tend to use the same technique as Joesph, I think its best to avoid hacks wherever possible.But using an extra DIV like this is also a hack. And not better IMO, since it mixes structure and presentation.My approach is to *not* mix dimensions with padding/border declarations onthe same axis.I don't think padding is an issue since it can be moved down to the inner elements.Border is more tricky, but it is always possible to keep the box model inmind and plan ahead when it comes to visual design...Thierry | www.TJKDesign.com **The discussion list forhttp://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help**
Re: [WSG] Help with menu
Charlie Bartlett wrote: The reason I use this technique rather that the box model hack, is because we cannot guarantee that the box model hack will work in future browsers, I know its probably not going to be a big deal to fix it, knocking out a couple of lines of css shouldn't take long, but I prefer not to have clients moaning at me because their sites have suddenly stopped working. This technique is far more future proof, and allthough its not semantically perfect, i prefer it to having unnecessary voice selectors in your style sheet. What I was saying is that there are ways to deal with this without any hack at all. It is a matter of moving down the padding declaration. If borders cannot be achieved with images and that *a few pixels* create a problem (because the designer is looking for a pixel-perfect-design-across-the-board), then one can use a conditional comment to fix IE5. In any case, there is no need for an extra DIV in the markup or CSS filters in the stylesheet. Thierry | www.TJKDesign.com ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Help with menu
On Nov 15, 2005, at 12:20 PM, Thierry Koblentz wrote: It is a matter of moving down the padding declaration. This is essentially the same as adding the extra div. div pfoo/p /div Apply the padding to the p instead of hacking the div. It's the same difference. Right Thierry? ;-) - Tom Livingston Senior Multimedia Artist Media Logic www.mlinc.com ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Help with menu
Tom Livingston wrote: This is essentially the same as adding the extra div. div pfoo/p /div Apply the padding to the p instead of hacking the div. It's the same difference. Right Thierry? ;-) Exactly! It's about constructing the box, not fixing it ;-) Thierry | www.TJKDesign.com ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
[WSG] Help with menu
I am having problems with a menu that is similar to the Alistapart's hybrid menu. I can not get the width to be consistantly even with the rest of the site and it is not workig in IE or Opera. It works fine in Firebird. I have been beating my head against this for quite a long time. It seems that absolutely positioned widths do not behave as I expect them. Oi! http://twitch.sharkpork.com/_work/Freedom/ Help me Obi-wan you are my only hope Thanks guys,-- __Bugs are, by definition, necessary. Just ask Microsoft! www.co.sauk.wi.us (Work) www.arionshome.com (Personal) www.freexenon.com (Consulting)__Take Back the Web with Mozilla Fire Fox http://www.getfirefox.comMaking a Commercial Case for Adopting Web Standards http://www.maccaws.org/Web Standards Project http://www.webstandards.org/Web Standards Group http://www.webstandardsgroup.org/Guild of Accessible Web Designers http://www.gawds.org/
Re: [WSG] Help with menu
James O'Neill wrote: I am having problems with a menu that is similar to the Alistapart's hybrid menu. I can not get the width to be consistantly even with the rest of the site and it is not workig in IE or Opera. It works fine in Firebird. I have been beating my head against this for quite a long time. It seems that absolutely positioned widths do not behave as I expect them. Oi! http://twitch.sharkpork.com/_work/Freedom/ Help me Obi-wan you are my only hope Did you give this one a try? http://www.tjkdesign.com/articles/dropdown/demo.asp It is a bit moe accessible. Thierry | www.TJKDesign.com ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
