Re: [css-d] Drop-Down functionality
On 04/09/07, WEZ! [EMAIL PROTECTED] wrote: I have worked on a three-tier drop down menu system designed with pure css for functionality and javascript to achieve functionality in IE. The website can be found here: http://www.newearthpermaculture.com.au/bm/BusMentorMenu18.htm So far the CSS side appears to function flawlessly (aside from other layout issues). The problem are now with the javascript code and IE. On a purely validation issue the javascript code grabs 'li' through child nodes on a 'id' and assigns them a class which has mouseover, mouseout commands attached. This code however only gathers the direct children and not nested children below this. This amounts to having to use a second run through the javascript and multiple id's which of course fails validation. Does anyone who knows javascript better than myself tell me what needs changing in this code to get all children gaining the class not just the direct child nodes. Here is the code: This is more of a Javascript issue than CSS, but the script on this page: http://www.htmldog.com/articles/suckerfish/ should do what you're looking for. The basic function you need is getElementsByTagName, which returns all elements (including deep descendants), so you don't need to put an ID on anything other than the top-level UL. Also, performance can suffer if you have a lot of handlers which all do the same thing, sometimes it's better to just attach one handler to the UL and let it work out which LI you actually clicked on. cheers, Tom __ 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] Sorry the subject is different-my last post was not site check please
Hi Trevor,
On 03/09/07, trevor bayliss [EMAIL PROTECTED] wrote:
CSS guru David Laakso very kindly gave me some code:
br.both {
clear : both;
}
br.right {
clear : right;
}
br.left {
clear : left;
}
.clear {
height : 0;
clear : both;
}
This effectively defines some helper classes for clearing - making
sure that any floats are placed and further content appears below
them.
For example, with the following HTML extract:
div style=float: left; width: 20em; background: #ccc; color: #000;Left/div
div style=float: right; width: 20em; background: #ddd; color:
#000;Right/div
div style=float: left; width: 20em; background: #eee; color:
#000;Left again/div
div style=float: left; width: 20em; background: #eff; color:
#000;Not floated/div
try putting
br class=both /
at various points in between the lines. Then try br class=left /, etc.
http://www.quirksmode.org/css/clearing.html
Not quite sure about the strict XHTML part of your question though.
It applies to HTML4 just as well.
cheers,
Tom
__
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] different browsers
Hi Terri, On 03/09/07, Terri Houston [EMAIL PROTECTED] wrote: Is there a website where I can see my menu page with all the different browsers? If not, can someone check www.ttcollectiblegifts.com/dynamicdrive.html using IE6, and send me a screenshot? I was told the menu was large, and I hope I've fixed it, but can't see it with IE6. All help is appreciated. These two sites work well: http://browsershots.org/ http://www.browsercam.com/ The page itself is extremely tall in IE6. The vertical scrollbar appears, scrolling down just shows blank content. Also, it looks like you have some CSS styling in the middle of the page, rather than in the head where it would normally sit. cheers, Tom __ 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] Full height, centred layout with multiple columns
Hi all,
I've been trying to achieve a layout which uses two full height
columns, with the
#wrapper { min-height:100%; }
* html #wrapper { height:100%; }
approach used in a few places (and discussed on the wiki).
However, I've not been able to get this type of layout to work with
two background images when the content overflows the bottom of the
viewport. There is an example page here:
http://fullheight.monotherapy.dyndns.org/index.html
Two other issues I haven't been able to resolve with this layout:
* margin: 0 auto; to position the layout in the middle of the
screen... because I'm using floats, I can't do this, and when I wrap
everything in a float and try setting the height on this element, I
lose the full height effect anyway
* with footer content of different heights on the main column and
right column, things get even more complicated!
I'd really appreciate any suggestions on this, or pointers to places
where it's been done properly.
thanks in advance,
Tom
__
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] stubborn link color
Hi Gerry, On 31/08/07, Gerry Goodfriend [EMAIL PROTECTED] wrote: I have created a template from which all docs were created. I have set the Link Color in Page Properties to the color I want, and in some pages it is correct, and some not. The content of some of the pages has been pasted in from another site (www.ckutfolk.com), a radio program I'm taking over, and the link color of those is consistently purplish in my site, while some of my pages are the blue I want and others are that purple. Sounds like a:visited vs. a:link styles being applied. The default a:visited colour is purple in many browsers. Look for the style definition - I have no idea what Page Properties does to generate CSS, but there should be an equivalent Visited Link Colour, try changing that. Do a search for CSS link colour attributes and you should get a better description - the first one I found was this: http://www.echoecho.com/csslinks.htm cheers, Tom __ 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] Full height centred layout with two columns
Hi all,
I've been trying to achieve a layout which uses two full height
columns, with the
#wrapper { min-height:100%; }
* html #wrapper { height:100%; }
approach used in a few places
(http://css-discuss.incutio.com/?page=HundredPercentHeight).
However, I've not been able to get this type of layout to work with
two background images, when the content overflows the bottom of the
viewport. There is an example page here:
http://fullheight.monotherapy.dyndns.org/index.html
Two other issues I haven't been able to resolve with this layout:
* margin: 0 auto; to position the layout in the middle of the
screen... because I'm using floats, I can't do this, and when I wrap
everything in a float and try setting the height on this element, I
lose the full height effect anyway
* with footer content of different heights on the main column and
right column, things get even more complicated!
I'd really appreciate any suggestions on this, or pointers to places
where it's been done properly.
thanks in advance,
Tom
__
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/
