text:
Comments on Hybrid CSS Dropdowns
110 Reader CommentsBack to the Article
Mike P. (article author)
Nice example! I tried to get something like this going a while back but failed miserably.
That extra padding on the top of the nav bar in the parent li sure is nice for getting over to the links and not losing the :hover…Copy & paste the code below to embed this comment.
Will (article author)
Looks really good… but you gotta love the irony when the menus on the author's own page don't work in Safari. Perhaps they should be updated to use this hybrid. :)Copy & paste the code below to embed this comment.
Jay Small (article author)
Does this method (or any other that anyone has found) get around a common problem with cascading menu scripts vs. Flash objects?
You've probably seen what I'm talking about: user hovers on primary menu link, which activates drop-down menu, which appears *underneath* any Flash object that occupies the same page space.
I've yet to see a way to fix this. Help!Copy & paste the code below to embed this comment.
Sean (article author)
I don't think there is a way to avoid that. As far as I know, Flash is just slapped down on top of anything and everything in it's way.Copy & paste the code below to embed this comment.
david (article author)
Great, but everyone of these drop down menus I view say they work in all the browsers, but they never seem to work in Netscape 6.2.
I don't know the percentage of people still using this browser, but I can't wait to see one that works correctly in all the browsers version 5 upwards.
Still a very good job though!!Copy & paste the code below to embed this comment.
Luke Redpath (article author)
Getting drop downs to sit on top of Flash is actually quite simple - simply set the wmode of the flash to transparent.
See it working here:
(suckerfish variation).
I'm not quite sure what this article offers that suckerfish drop downs don't. Also, its not as accessible as it could be - you should be able to tab through the menus using your keyboard. Instead it relies on mouseovers only.Copy & paste the code below to embed this comment.
Richard (article author)
Very nice, if only i found this earlier…I spent hours trying to achieve this.
Some bad news: After checking out your final pretty version (link at bottom of tute) in IE 6 I regret to say the tabs are "flash". They just seem to appear and disappear as they like when hovering over them…
And I used to think NN 4.7 was a killer, Internet Exploder really does take the cake when it comes to its css implementation.Copy & paste the code below to embed this comment.
Ben Vaughan (article author)
When exporting your flash, you need to set the wmode correctly.
Macromedia has two tech notes that speak to this:
Hope that helps.Copy & paste the code below to embed this comment.
Richard (article author)
Oh dang!
Seems like the issue is the ol' "Check for newer versions of stored pages" option set to "Every visit to the page" casuing it.
Hmm, how annoyingCopy & paste the code below to embed this comment.
Ben Vaughan (article author)
There's also a custom http header your server can provide to IE the stops that behavior. Unfortunately, you will need to configure it or ask your ISP to.Copy & paste the code below to embed this comment.
Ben Vaughan (article author)
Whoops! Here's a link!
http://www.aspnetresources.com/blog/cache_control_extensions.aspxCopy & paste the code below to embed this comment.
Juan (article author)
Nice idea, but have you tried to resize this? It looks awful after a few larger text sizes.
Why can't you specify most of your CSS paddings and so forth using ems, rather than pixels?Copy & paste the code below to embed this comment.
Dustin Diaz (article author)
ironic everyone's speaking of flash yada. This is the best solution for a css version of the Macromedia dropdowns. Very elegent, and much room for style.
I definitely see this making it onto some of my future websites.Copy & paste the code below to embed this comment.
Dustin Diaz (article author)
I was just thinking, isn't there a way to compensate for the text resizing… maybe doing something like combining the sliding doors method with this one? might need an extra <span> or something, but I think it's doable.Copy & paste the code below to embed this comment.
Paul Carpenter (article author)
I must say that I still prefer the sucker fish drop downs, having both lists and sublists horizontal means that the entire thing is stuck on two lines whereas with suckerfish it is spread out ofther the page.
A nicer hybrid would be to see the submenu items (for the active section) as a side bar whilst having an old fasioned suckerfish at the top.
I suppose that would be achiveable by mucking about with the example in this article but it would take a lot of work.Copy & paste the code below to embed this comment.
Justin Perkins (article author)
The end result looks a lot like the navigation I created for a company back in July, only difference is the sub-nav reverts back to the originally selected sub-nav. Don't know which one I like better from an usability point of view though.
http://www.lendingpartners.com/Copy & paste the code below to embed this comment.
Miles (article author)
Hey, this is a really helpful piece. Thanks.Copy & paste the code below to embed this comment.
Miles (article author)
...the menu does seem offset to the right from the building image by about 50 pixels in IE 6. Not that I have any idea how to fix that, but just for the record.Copy & paste the code below to embed this comment.
Justin Perkins (article author)
Hey Dustin, take a look at my version I posted above. It uses a sliding doors technique and resizes OK, but I use relative positioning to place the navigation, so as you increase the text size the navigation drops down the page and exposes an unstyled area. I should probably fix that ;)Copy & paste the code below to embed this comment.
Remco Vermeer (article author)
It doesn't look so good on Opera 8.0 beta (build 7401) for Windows.
You can find a screenie here:
I know… opera 8.0 is beta, but still. I had to share it.
-nerd out-Copy & paste the code below to embed this comment.
Tony (article author)
Nice tutorial, but this doesn't work at all in IE5/Mac. All you get is the background photo…no navigation at all. (Not that I use IE5/Mac, but I do test for it always, as many people still use it.)
I know it *can* be done (CSS menus) to work in IE5/Mac. Just have a look at Project 7's Pop Menu Magic and see for yourself:
Perhaps their technique can be deconstructed sometime. It seems to work in all modern browsers, IE 5 and newer (including Mac), and even degrades nicely in really old browsers (4.x and older.)Copy & paste the code below to embed this comment.
Oliver (article author)
Every site I go to now, not many of them have dropdown menus, or anything that's dynamic (made with css or javascript or flash). The only one that's pretty good is the one on macromedia.com, which is in Flash. Sometimes css/javascript dropdown menus can be a hassel, especially when the submenus aren't positioned automatically.Copy & paste the code below to embed this comment.
Justin (article author)
I've been using a very similar technique for the main navigation on my employer's site:
It even works on Mac IE 5!Copy & paste the code below to embed this comment.
Eric Shepherd (article author)
To start: I recognize the irony that this is not implemented on my site; I never could figure out if it is a Safari bug or my own error, and I haven't had the time to re-address the problem. It is a completely different subnav, however, and was done 8 months before this article was conceived.
As far as browser support; there could be a number of ways to get this to work in the obscure older browsers like N6 and IE5/Mac. I stopped at the common browsers, and as someone caught, I have a padding bug in IE that I never fixed. I think it's as simple as a *selector to specify the padding for IE, but I haven't tried it yet. I simply don't support N6 and IE5/Mac anymore. If someone's still using N6, they really owe it to themselves to upgrade, and most Mac users on new-ish machines are browsing with Safari rather than IE. Even Microsoft doesn't fully support IE5/Mac anymore. And Opera 8? That's gotta be a bug, I don't know why it would be collapsing all the tabs. I'll test again when it gets beyond beta…
As far as resizing; the point is taken, and sliding doors could be a good technique to use here. I was going for a simple example, and my live implementation (which prompted this article) of this technique does not allow resizing. Since I was using Gill Sans on nepostrategies.com, it had to be an image and I couldn't use sliding door navigation. However, at least in Safari, going up and down two text sizes still has the subnav text within the blue horizontal bar and doesn't break anything too much aesthetically.
And Paul, a top menu with sidebar would be a great next step, and solve a VERY common nav issue. Of course, it wouldn't be as much hover magic as a positioning system. It would have to be an absolutely positioned child ul, and I've thought about it in the past. I'll have to try something on my next project.
I appreciate all the feedback!Copy & paste the code below to embed this comment.
Tony (article author)
Just as an aside: the reason I still test for IE5/Mac is because I work for a school district. Darn near every Mac in every lab in every school here uses IE5. Sure, there are some newer machines floating around, but most are *really* old (budget issues.) I think you'll find that in most K-12 schools (not counting private schools, or public schools in super rich neighborhoods), you'll get a pretty high percentage of IE5 (or older.)
I sometimes teach summer (or after school) workshops in web design, and I like to point the students at well designed sites. It's a shame when a site I find doesn't work (at all) when the students try to visit. (Although, I must say, it does provide a perfect segue into designing with web standards, and making sure your site degrades gracefully for crappy browsers.)
So, if students surfing the web or teachers looking for something educational are nowhere near your target market, that's fine. Otherwise, it's probably best to make sure any design implementation at least degrades gracefully. It doesn't have to work (like it does in modern browsers), but it should still be useable (even if, in this case, it only provided the parent links or even just an unstyled list.)Copy & paste the code below to embed this comment.
Michael (article author)
If you put the flash object and embed tags all within a container div, you can adjust the z-index of the div, thereby affecting the Flash movie's stack order.
Haven't really tested this much beyond IE6 and FireFox, though I can say it works quite nicely in both.Copy & paste the code below to embed this comment.
h3 (article author)
It's a real nice article, congrats. It works the example works perfectly in firefox, but i tried it in Internet Explorer (6.0.2800) and, deception, some major glitches appeared.. the mouseover event (on any links in the menu) makes the selected tab "flashes" .. i noticed that the also nice "suckerfish" menu triggers this bug .. wich, strangely no one noticed.. So i decided to try it on my laptop, wich is running the same xp version BUT with Internet Explorer (6.0.2800) .. no glitch. That's exacly the kind of things that makes us love ie. F****** IE.. I've said it.Copy & paste the code below to embed this comment.
h3 (article author)
My laptop runs Internet Explorer (6.0.2900).
Sorry, my mistake :pCopy & paste the code below to embed this comment.
Eric Shepherd (article author)
Argh. I only have one each of 5.0, 5.5, and 6 to test on. So, for the listening audience, is there definately a problem in a version of IE that isn't just the page-refresh-every-time thing?
I don't have a problem in my version of IE, which happens to be 6.0.2800, but it is on a Win2K system, not XP.Copy & paste the code below to embed this comment.
R6MaY89 (article author)
Maybe I am very confused, but I think I have a problem with this (more likely, i am making a really dumb/obvious mistake). I have a #container div that contains the entire site and so that it can be centered. that container is set to position:absolute;. When you put an absolute object (like this menu) into another absolute object (the container), doesn't the container close to accomodate the menu?
on another note, i don't understand why anyone lucky enough to have a mac would use ie! there are so many other good browsers for macs, even the teachers at schools (prob. old and grew up using typewriters and punch cards) should learn to not use ie…Copy & paste the code below to embed this comment.
Dustin Diaz (article author)
I think it's a perfect time to just be honest with your students. IE5 is just an old browser and it makes perfect sense why certain techniques won't work on it. I'm sure the kids in class will understand.
I dropped IE5 (win and mac) from my testing support near the beginning of this year. My stats show some rediculously low percentage ( .00niner2six??% ).
It just seems that if you're worried about making a site truly cross-browseral (and cross-ages), you wouldn't be implementing techniques like on your site.
It would be quite a damper if all we ever heard was comment like "It doesn't work in browser x and browser y." Look at the entire picture here. It's simply amazing that something like this even works! Just take a brief peak at the css and you'll see that it's no slim file (considering it's only powering just a site navigation menu). It uses a combination of classes, id's, <a> tags, even an extra <span> tag because it's doing so many wild things. ... If it weren't for the brief snippet of js, this wouldn't even work in IE6.
I like your sliding doors drop list on that loan site. The only problem is semantically it doesn't show the hiarchy structure properly. But I'm sure with 'nuff evaluation that could be tweaked.Copy & paste the code below to embed this comment.
Andy Schneider (article author)
I just checked the final example with my Opera 7.60, Build 7321 and the navigational tabs are aligned over each other.Copy & paste the code below to embed this comment.
Justin Perkins (article author)
Dustin: That's exactly what I started thinking after I posted that link. Notice I posted:
"The *final* product looks like…"
Notice there is no mention of the internals.
Yeah I should fix the semantics of it, I went and changed the resiability so it uses em's instead of pixels to position the navigation though.
That's what this article has really got me thinking about, the semantics of sub-navigation lists and minimal JS (for IE). It's hard to shake the old "markup for layout" ideas ;)Copy & paste the code below to embed this comment.
Cosmo0 (article author)
how does the hover works on the… well…
english is not my native language, but i'll try to say it correctly.
On the last example (not the one with the images, but the green one that works), by default "modern" is selected. When your cursor goes over the sub-menu of "modern", the "modern" item's background goes green. How ? How do you say : the parent element of the a goes green ?
Thanks !Copy & paste the code below to embed this comment.
Adam Guasch-Melendez (article author)
Can anyone point me to a decent CSS dropdown menu that works with a keyboard? Accessibility - for vision-impaired users, or mobility-impaired users who can't use a mouse - is an absolute must for me. So far, the menus in this article, and the examples pointed to in the comments, all fail the keyboard test.Copy & paste the code below to embed this comment.
Eric Shepherd (article author)
The background you're talking about is in the last instruction of the CSS for that page:
#nav li.off a:hover, #nav li:hover a {
background: #d6e3b0;
It does the same thing for all the five main nav links, not just the active one, in this case. They all get the same background when hovered, just as in the final example, when they all get the blue background when hovered.
To do a custom background for this item, you would do the same thing, but with more specificity, i.e. #nav li.classname:hover a, or you could write this class dynamically with JavaScript.
Accessibility. Yes. I'm thinking about ways to make this sort of nav more easy to get around wrt accessibility issues, however, this technique, unless I'm mistaken, should still show the current subnav without any hovering, allow you to select a new top-level nav, and then show the new active subnav when the next page loads.
Someone who knows more about this that I do, please inform as to whether this is correct.Copy & paste the code below to embed this comment.
Richard (article author)
Hi again,
You mention: Finally, we'll show the subnavigation bar for the active topic area, "Modern." The best way to do this if you want only one central, complete menu file, is with a body class of, say, "Modern," and corresponding selectors"
Can someone please give me an example of using the body tag to set the active item for this menu?
Thanks in advanceCopy & paste the code below to embed this comment.
Aleksandar (article author)
Since when is ALA publishing articles with non-valid examples? DOCTYPE anyone [1]? Apart from last example, rest of them look like '94.
Second, final example - the one that actually demonstrates the article's essence in all browsers - fails in IE as submenu is offset to the right. Is this just me, as I don't see it mentioned in the article. I tried refreshing and all kind of things, but it simply does not work.
Third, that final examples is image based. I, for one, expected to see all-text example, where the real challenge lies. Images are easy, since one does not have to worry about resizing problem nor about correct positioning of the submenu so that hovering down is possible.
Forth, this very topic was tackled over 1.5 years ago, when Alex Robinson did first tests about it and asked [2] (few times) on css-discuss list for help on sorting out few issues. I took the plunge and we came up with solid solution [3], that works nice with ems (resizing problem that is mentioned in comments). I tested it with real-life example, and it worked, more or less. [4] If I remember correctly, I think that I sent a message to css-discuss about it.
Few months ago I perfected that example thus it works just fine now, in all I could test with (IE, Opera, FF, Safari). [5]
Thus we have over-a-year old technique featured in ALA, which used to publish really ground-breaking stuff. Sad. And who knows what other goodies are buried in css-discuss archives…
[1] http://www.alistapart.com/articles/doctype/
[2] http://archivist.incutio.com/viewlist/css-discuss/34658?highlight=nestedsubmenu
[3] http://www.aplus.co.yu/4ow/alex/
[4] http://www.aplus.co.yu/css/nestedtabs/
[5] http://www.aplus.co.yu/css/nestedtabs2/Copy & paste the code below to embed this comment.
Eric Shepherd (article author)
Thanks for the input.
About doctype: yes, I didn't include one for the progress example pages. An oversight on my part.
About the IE positioning problem: you're right. I overlooked this when testing; I remember thinking "I need to fix this" and I forgot. That said, I don't think it's a huge issue to fix. I mentioned this already, but I apologize for this oversight; it should have been fixed before this was published.
As far as this being tackled on CSS-discuss, and your example: your example looks very nice, and the code is attractive. I first used this technique on a site last summer, and this article was written in late August or early September; there was a delay in publishing it, and I admit it is perhaps less cutting-edge than it was nine months ago. That said, I think it's productive for the technique to be disseminated to a wider audience than css-discuss, as probably few designers read it cover-to-cover on a daily basis.
You're right: text-based nav is "where the real challeng lies." However, if my choices are resizing and losing menu options or keeping all my options and not being able to resize, I'll take pixel-precise absolute sizes anytime. Your example doesn't even allow me to go up one text size (in Safari; I didn't look at it in anything else) without losing "about nokia", and one menu option is lost with each size up. How are you going to explain to Nokia that less-sighted users who want large text simply won't be able to access some of the nav options?
The only text size on your example that lets me read all the options is about the same size as the text size on my fixed, image-based nav. And, if a user resizes, they will still get all the nav options.
That said, if you take your example and add the ability to resize without losing important nav options, it is quite elegant, and could actually be used on a production site. There's no reason sliding doors couldn't be used here, I just chose to keep that aspect of the example more simple than that.Copy & paste the code below to embed this comment.
Zeerus (article author)
Although the coding came out better on yours, Veerle's version has a better look. Maybe yours would be better if I saw it used in an actual website design. Anyway, if anyone hasn't seen it yet (not sure if somebody already posted this), Veerle made on around the same time. http://veerle.duoh.com
She had some problems with hers, wanting it to only use 1 image, so she was hoping htis article woul help with thatCopy & paste the code below to embed this comment.
Adam Guasch-Melendez (article author)
The CSS menus I've seen, when used with a keyboard, display the top-level nav and one of the sublevels. That creates one issue - you're presenting less information to a keyboard user than a mouse user. Yes, it's somewhat functional, but it's far from desirable.
The slightly more significant issue is that in most cases (not all), as you tab through links, you will tab through ALL links, in order - even the ones buried in submenus that you can't see. So you may tab to a link, get a visual indication of where you are, then hit tab, and you're lost. You see no sign of what you just tabbed to. Hit tab again, same thing. 5 or 6 tabs later (assuming you haven't given up and left the page already), and you pop back onto the screen at the next top-level menu item. And then you're gone again.
Accessibility is not just about "does it work?", it's also about "does it work well?" Unfortunately, I haven't seen CSS menus that work well, yet.Copy & paste the code below to embed this comment.
Eric Shepherd (article author)
OK…so, as long as the selected subnav is being displayed, the user doesn't get the hover benefit to access all the options, but isn't prevented from getting to any of them. I will start thinking about scripting solutions to get around this. Maybe an activation of a subnav with a focus event?
Are tabs supposed to cycle through items set to display:none per spec? This seems to me to be a browser issue. Does anyone know what the behavior "should" be for subnav items?Copy & paste the code below to embed this comment.
Aleksandar (article author)
Just to clear one thing out - the prior art wording you used urged me to re-read my post and realize it can be understood wrongly.
I'm not accusing you of taking-over the code Alex and I did and then publishing as yours. I believe that you have never seen it, which is the biggest shame at all, as you could save time on initial development and solve the remaning problems. I simply mentioned that this is not new and "new" is something I expect from ALA article.
Or at least expect to solve the resizing/overlapping problem you mention yourself. That would be cream of the cream.Copy & paste the code below to embed this comment.
Eric Shepherd (article author)
I didn't actually take your post that way; I apologize if I was a bit defensive :) Your subject line initially was a little provocative.
My response was only meant to point out that your example has some serious problems - nav options should not ever just vanish with a little text-resizing, and this example does not have this issue because of the image-based main nav. Neither is perfect.
As far as ALA and "new", that's up to the editors. Part of this issue, as I said, is a publishing schedule - ideas don't go from experimentation/blog entry to article to published overnight. Another angle, I assume, is the desire of ALA to communicate ideas to those beyond the world of lists like css-discuss.
I "invented" faux columns (along with probably many other people) well over a year before Dan's article, but I didn't write an article, and the web community as a whole hadn't implemented the idea yet, so an article was a productive addition to ALA.
Finally, TextDrive is having problems, and my site is down today; if anyone has tried to send email, sorry about the bounce and please try again later.Copy & paste the code below to embed this comment.
Aleksandar (article author)
Once I started thinking about this problem again, once natural solution for main item wrap comes to mind: define menu width in ems too.
If the text size is enlarged, the menu itself will enlarge and all happy (I updated the example on my site to show this).
Every solution has weak spots. For this one: small screen size and large fonts will yield horizontal scrollbar. Which is not a problem but an annoyance. On the second glance - I have yet to see a person using 800x600 and Largest text-size setting.
I usually enlarge text size when I'm using large resolutions on small screens, like 1400x1024 on my Dell 15" laptop. In this scenario, this works like a charm.
If you have a pixel-set graphic design, then this will lead to menu going outside the right edge. Another thing can be tried then - setting min-height to a value that would accomodate at least two rows of text. It depends on layout in question really. and good layout that should take into account issues like this.Copy & paste the code below to embed this comment.
Tony (article author)
I think you missed a very important part of my post: this is a closed environment (school computer labs) with old computers. There are no browsers to upgrade to! IE5 is the most recent browser that will run on those machines. The sad thing is, you'll find this in *many* K-12 schools throughout the country. It's one area where it's not always possible to simply "upgrade the browsers."
Also, if you look back at my initial post, you'l see I linked to a list based CSS solution that DOES work in all browsers, even IE5/Mac, so my point is: if it's worth doing, why not do it right? (No offense to the author…it's a fine article, and a good learning tool.)
It *is* possible to get this functionality that is truly cross browser, and that degrades very well for really old (4.x and older) browsers, works on cell phones and PDA's, etc. So, I think it's a bit too convenient to simply say "just upgrade your browser." Some people can't. It's that simple. I think it's safe to say the overwhelming majority of those who visit this site are designers/developers of some sort. We tend to be on the cutting edge, and will always have the latest technologies. If you look at the browser stats for this site, you probably won't see many oder browsers. But, what if youre site has educational value? You should make sure, then, that it can be used by the target audience, which in this case would tend to have older browsers (if we're talking K-12). If not, sure you can just ignore v5.x browsers. But, if it's very much possible for this (and most) designs/tools to work in v5.x, why not just do it?Copy & paste the code below to embed this comment.
Brett Bieber (article author)
I have heard, the difficulty with something like this is how precise your movements have to be to navigate the second line. We utilize a very similar navigation system for our University websites, albeit yet another implementation. http://www.unl.edu/webdevnet/
In the example there's plenty of padding to make it more forgiving, but on sites that have many many links the padding has to be reduced - making it difficult for people to get to the line 2 links. Adding to the problem is that you must remain hovered over the second region to show the links. If the user slips off the second nav line, all is lost.
The CSS example is great, but with a little javascript settimeouts and careful planning - we could really have a nice compliant version of Macromedia's (Flash) navigation system.Copy & paste the code below to embed this comment.
Remco Vermeer (article author)
Just downloaded and installed Opera 8 build 7522 for windows and the Hybrid CSS Dropdowns works like a charm now.Copy & paste the code below to embed this comment.
Eric Shepherd (article author)
If anyone tried to contact me directly or visit my site; things are back up now and email shouldn't bounce back. A scary outage at theplanet; 12 hours or something like that, caused by a blown fuse…
Thanks for the Opera 8 update; I'm glad it was a transient bug.
And I like the use of timeouts for the menu system at UNL, Brett. Very nice addition.Copy & paste the code below to embed this comment.
Per Allan Johansson (article author)
Cool menu, works just fine in Firefox, but bugs in IE6 and the tabs doesn't show at all in Opera 8 BetaCopy & paste the code below to embed this comment.
Vitaly Friedman (article author)
Thanks for new and useful tabs - I've been looking for similar one for a long time now and I also tried to create something similar, however, without any proper results.
Thanks!Copy & paste the code below to embed this comment.
Sainkho (article author)
"I'll take pixel-precise absolute sizes anytime."
As the designer that is your choice, some of your users won't thank you for it, mind.
Why the obsession with dropdowns? Go on, force your users to follow precise cursor paths to their chosen link or risk triggering a neighbouring set of options and frustrate 'em.
But I enjoyed the read and discussion - as always!Copy & paste the code below to embed this comment.
Eric Shepherd (article author)
Is that if the user doesn't follow the precise path and can't handle the dropdown, it doesn't keep him from the information; I think that was said early on in the article.
The obsession with dropdowns is that they provide quick access to many pages without having to click through a set of interim pages. For users that know where they want to go, this is a useability benefit.
For those that don't, this type of menu still allows them to access everything, unlike traditional dropdowns where all the options remain hidden in the menu unless hovered.
Based on the several really nice implementations of similar menus that have been posted on this discussion board, it seems that others have found this idea, in various forms from Flash to CSS-based, to be beneficial.
One's frustration is perhaps anothers' benefit. I guess that's the crux of any of these disucssions. Nobody's saying that any one technique is right for every website. As a user with manual dexterity and a knowledge of what I want, dropdowns are beneficial to me.Copy & paste the code below to embed this comment.
Christoph Richardet (article author)
This article is really nice and everything works perfectly - except in ie6: the submenu (.old ul, .off ul) has an offset of some pixels in the final css example (hybrid-4.html). Can it be a problem with: padding-left: 60px?
But we all now how to fix this ;-)Copy & paste the code below to embed this comment.
Chris (article author)
I don't see how that is much of an improvement.I was especially put off by the way it uses block and none for display, a technique that is known for a long time now to be an accessibility issue and was published here [1].
This solution still has the same problem as any CSS nav solution:
1) It is not keyboard enabled - Visitors might have to tab through a lot of invisible links to get where they want (mentioned in one message before this one already)
2) It still is a matter of "sitemap as navigation". Why do I need all links to every page in the site on every page? For the high end user, that is fine, but for people who have problems with too many links (switch/keyboard access, screen reader) it is just annoying. Hiding things doesn't remove them. [2]
Back in the days when we started playing with DHTML we did it completely wrong by making the whole navigation dependent on JavaScript, maybe it is time to make JavaScript work for us and only add the extra bits for those who can use them and want them.
[2]http://www.icant.co.uk/forreview/dynamicelements/Copy & paste the code below to embed this comment.
Rachel (article author)
Can this type of menu be navigated by keyboard users (i.e. people who cannot use a mouse… for example, people who use screenreaders)?Copy & paste the code below to embed this comment.
Justin Perkins (article author)
> Visitors might have to tab through a lot of invisible links
Isn't that the whole point of the "Skip to content" link that is quite common?
Although I agree that CSS display properties can open up accessibility issues, isn't the real source of the problem screen readers attempting to render a screen stylesheet is if it was aural? If that's the case, it would seem like the easiest solution is to create a stylesheet just for screen readers and provide a link to that stylesheet right at the top of the page. That way the special screen reader CSS could be activated by the visitor (and carried throughout their visit, by cookies).
I really like sub-nav, at least on bigger, commerce based sites that get quite deep with navigation. I don't think arguing against the usage of nested navigation really holds water if one is arguing accessibility. These issues can be worked around without dropping the nested navigation altogether.Copy & paste the code below to embed this comment.
William Dodson (article author)
I think that it represents an elegant solution. It even sort of mimics the Flash menus that use this UI meme (Macromedia.com)
I had also tried working on something much like this but never could seem to get the hover to work correctly so I left it static.Copy & paste the code below to embed this comment.
Chris (article author)
Justin: How could you work around these issues with skip links?
First of all the navigation is one entity, so you'd need to put a skip link before every nested list to skip it.
Secondly screen readers also offer a list of links in the document to navigate directly, and the links will show up there.
Even when you can navigate them, it is just really annoying to get all that information that just is not needed to navigate the site.
I agree that nested navigations can be a handy shortcut, but they should only appear when you can use them.
The flaw of screen readers trying to render visual stylesheets is bad, but I guess it was needed to make them usable UAs for browsing, much like browsers do render invalid HTML, whereas they should not.
It does not matter how the CSS is when the HTML/content is just too much. You don't print the index of a book on every page, you print it at the end or at the beginning.Copy & paste the code below to embed this comment.
Eric Shepherd (article author)
By this analogy, each page in a website would have a link to only two other pages and a site map.
I understand what you're saying, but the whole point of the web is that we can jump to many places from one place. I agree, the scale can become unworkable, and will be a problem with large lists until screenreaders and the like get smarter, but I'm not satisfied with a comparison of the web and a book.Copy & paste the code below to embed this comment.
Chris (article author)
And it is matter of judgement how many links are bearable and how many are just too much. What is the important bit of the web page? Its content or how many more are available in the whole site? Do we want to help the visitors to find what they came for or do we want to offer them everything at once?
I never claimed web sites should be like books and we should only have links to the next, last page and the sitemap I just compared offering all links on a page to printing the index of a catalogue on each page. We offer too many options where they are possibly wanted but not needed.
Nested navigations are an extra offer to avoid a page load and a drilldown in the navigation.
It is for us to ponder if they are worth it when they can be a bother to use for some.
The other visitors will see the whole navigation at once, which can be far too much information.
The logical step would be to only offer the extra information to those who want it and not assume that everybody does benefit from it.Copy & paste the code below to embed this comment.
Justin Perkins (article author)
Who are these "high end users, with CSS enabled" you speak of Chris?
What you're suggesting (adding sub-nav dynamically) seems to be putting far too much reliance on client-side scripting when your end result is something that 90% of the visiting population (or so) *can* take advantage of.
Couldn't I just as easily put a link right in the top of my document which when clicked will load my site, but without the sub-nav? Or (as I tried to explain earlier), just add another stylesheet that hides the sub-nav from all?
I don't know, seems like a draw I guess. We could probably argue the advantages/disadvantages of each method to no end.Copy & paste the code below to embed this comment.
Mike Funk (article author)
I had this kind of menu going for a long time at my company. I eventually changed it to be a traditional drop-down. While the hybrid here does give great clues to navigation, there are also a few major drawbacks that take away more than they add in my opinion.
The worst problem is the mouse space. When you want to change a section, you mouse over it, move down, then move across to the item you want on a thin line, being careful not to go outside the line. If you lose the line, you have to go back and start all over. Traditional drop-downs don't make you change direction while navigating, you just drop right down to your item. Plus there is lots more room horizontally with normal drop-downs than vertically with hybrids because you're not trying to stay within just one line. This makes navigation MUCH easier and not so much an exercise in mouse accuracy.
Next is that since it is horizontal, there is a limited quantity of submenu items that can be put on it without rolling over to the next line. Usually these kind of things are kept on one so you don't get blank space from one carry-over and because it's more difficult to tell that these are sub-items when they're in a big jumble. So the one line limits you.
Also with the one line, if your right-most tab only has one or two sub-items, you run into problems. You can't position the list all the way to the left because it will look like the sub-items are part of some other tab or no tab at all. (unless you use a high-contrast tab structure like the example) You also can't position the left-most sub-item with the left of the selected main item because it will quickly run off the right side of the page. And it becomes a bit tricky to align the main and sub-items to the right, plus it messes up the first item.
Last is the obvious two-level limit in navigation. This limits both ways. If you want to have a menu item with no sub-items then you'll have to have a blank line or it will jump down when you roll over another item. This looks weird to have a blank line because you wonder why it's there. On the other hand, you can't go more than two deep. Otherwise you'd have to either do traditional drop-downs afterward (weird) or continue the lines down and down (even weirder) or lay the lines across the whole page over top of the current page as you dig deeper and deeper. (which hides the page)
As you can see, all these things eventually added up to the return of traditional drop-downs.Copy & paste the code below to embed this comment.
Chris (article author)
That is why my stance is to make it available to them but not force it on the others.
Let's check the facts.
- All levels of navigation on each page are not a need, they are a shortcut - a "nice to have".
- Users without either JS or CSS or both will get a lot of links they don't need.
- We cannot rely on Javascript being available (it is not in high security areas like financial institutions for example), but we can test if it is available.
- We cannot rely on CSS to get rid of the unnecessary links as visual hiding is not removing them from the document.
Therefore the most usable and unobtrusive way is to:
- Give the visitor the bare minimum of navigation and an option to have an "extended navigation" - an option that can be stored in a profile or a cookie for the next visit.
Or if that is an unwanted step:
- Give the visitor the bare minimum and expand it only when JavaScript is available.
The latter option would mean no difference in the site experience, but is more flexible.
It is the same logic we applied when we moved screen furniture from image elements to the CSS.Copy & paste the code below to embed this comment.
theo nobel (article author)
i use a div like someone else wrote that will position my whole site. Now the navigation will work in Firefox but in IE6 it will not allow me time to select a subnav. The thing has to do with position:absolute but is there a way to fix this problem? i really need this… cause 12 hours of transparancy in IE hack and now this i cant handle this anymore:S
well ill hear… maybeCopy & paste the code below to embed this comment.
Jens Meiert (article author)
Before everyone praises this approach it should be clear that such menus imply more or less severe usability problems especially for elderly users or users with motor problems.
Personally and apart from this, I liked some ideas presented in the article.Copy & paste the code below to embed this comment.
popartpopeye (article author)
Hybrid CSS Dropdowns… loox really bad in Safaribrowser.. Pity… GREAT STUFF though!Copy & paste the code below to embed this comment.
apartness (article author)
>loox really bad in Safaribrowser..
Loox really good in 3 versions of Safaribrowser ALA tested it in or ALA not have pubbblished it.Copy & paste the code below to embed this comment.
Andrew Beeken (article author)
This is an interesting read. I only wish it had been published earlier - a client of mine was after something similar with their site!Copy & paste the code below to embed this comment.
michael thorne (article author)
Looks good in "standard/default" mode but when
I ctrl+ in Firefox 1.0.2 to increase the font
size, only the sec-nav change, the tabs don't.
:-( Same for ctrl- to shrink the font.
After 4 ctrl+ the sec-nav starts to wrap and
the bottom half of the words are cropped. :-(Copy & paste the code below to embed this comment.
Lynda Elliott (article author)
All I get is the image, without the menu. It works in Navigator for the Mac….Copy & paste the code below to embed this comment.
Matt Inman (article author)
Why doesn't anyone use the function getElementsByTagName()?
It's much more elegant than using a for loop to iterate through each of an element's children to find all of one type of tag.Copy & paste the code below to embed this comment.
Matt Inman (article author)
Does anyone actually USE that browser any more? As in, anyone who matters?
I'm a firm believer in discarding broken or out of date browsers from my support roster, since most users of Netscape 4.x and IE Mac will be pretty much used to dealing with pages that break on their browsers anyway.Copy & paste the code below to embed this comment.
Michiel van der Ros (article author)
I was looking for a way to make pulldown menus without browser detection, because clean xhtml/css was supposed to get rid of browser detection scripts. Of course IE not supporting the hover function for anything besides 'A' makes this hard, but I keep hoping for a different solution.Copy & paste the code below to embed this comment.
BA (article author)
when i view the menu in the opera, the last menu item jiggles 'n wiggels!?Copy & paste the code below to embed this comment.
Marc Doyle (article author)
I tried to view this on IE 5.1 for Mac and it doesn't work. Should it work?Copy & paste the code below to embed this comment.
Genau (article author)
I did one, but i guess that this version showed have a little trick
check this one…
i built using some advices from a list apart.Copy & paste the code below to embed this comment.
Genau (article author)
Check this out…
http://www.meucarronovo.com.brCopy & paste the code below to embed this comment.
Andrew (article author)
I've noticed the IE6 offset issue as well. I made a menu and once I check it with IE6, I had the same problem as the example at the end of this tutorial. Is there a fix for this IE6 bug? It's kind of frustrating spending the time to follow a tutorial and then realizing that it won't work in IE…Copy & paste the code below to embed this comment.
Bee (article author)
Just an FYI—
using Safari 1.0.3(v85.8.1) [via 10.2.8, Old School I know…] having a couple issues:
* am seeing each main menu name, below the related submenu items, indented, half line below (obscurring submenu text).
* Under the Modern tab (orange), the hover of submenu items displays the main menu background (blue bg with clipped-corner) in the submenu, and changes the text color to orange (instead of blue).
* Rolling between main tabs is inconsistent. Sometimes it works, sometimes it doesn't.
Something strange is afoot at the Circle-KCopy & paste the code below to embed this comment.
Bee (article author)
another FYI—
On my system, the submenu at arkitrave.com does not work totally either.
Submenu is always stacked on left edge below Home tab. And not clickable, as it disappears when I come off the tabs.
Not a CSS-guru by any means—just here to learn. I don't think my Safari config is altered beyond stock.
But maybe it is just my system…Copy & paste the code below to embed this comment.
Eric Shepherd (article author)
I built the site well over a year ago, and the dropdowns have nothing to do with this article. They work like a charm in everything except Safari, and I've never figured out whether it's my bad coding or Safari that causes them to break in Safari. I am aware of the problem. Know that it is a different set of code, as the current article works fine in the Safari that I tested in. I'm not sure what the problem is for the older version in 10.2.8.
Maybe I will go back to JavaScript rollovers :)
No, seriously, thanks for all the observations from different versions; it is impossible to test for all of these browsers and OSs. I do pretty well with my local PC/Mac Intranet and 9 or so browsers, but it's all under Win2K or OS10.3.
I have on my list to fix the indentation problem in IE6 - I don't yet know what's causing that and I'll post something to my site when I figure it out. That said, don't hold your collective breath, as I've got a busy spring coming up.Copy & paste the code below to embed this comment.
Ricardo Aroca (article author)
Excelente artículo ... justo lo que buscabaCopy & paste the code below to embed this comment.
Bee (article author)
Hi Eric—Sorry to divert focus to your site… given it's different code and older. (should have read every response prior to mentioning it)
Thanks for an outstanding article!! Was not trying to be a pain-in-the-rear… only trying to explain the issue with 10.2.8 specifically.
popartpopeye mentioned on page 7 (in not a very helpful way) that his Safari wasn't working properly. If he was having the same issues as I—thought you could use some more info about specifics.
Keep up the great work though!Copy & paste the code below to embed this comment.
Jason (article author)
I've implemented the menu on an elastic site with two main problems. 1) (I think everyone has already discovered) My main-level links wrap, but they are then hidden by the "on" sub-nav that is positioned directly below line 1 of the main-nav. Any way around this? (he asks, expecting silence).
And 2). Because the site is elastic, the sub-nav width needs to be set to 100%. But in IE, when the width is set to 100%, the sub-nav li's all appear one vertically on top of the other. The only way to render them horizontally is to specify the width of the ul in either em's or px's. Anyone know of a way around this?
NOTE: The implementation is located at the linked site (which is hosted on my computer and may or may not be online). The site is essentially a personal experiment in xml from start to finish. Pay no mind to the content. ;-)Copy & paste the code below to embed this comment.
Geoffrey (article author)
Looking at the final menus in Firefox and IE6 side-by-side reveals that they don't *quite* display the same. For example, in Firefox, the header image and menus are flush left. However, in Opera and IE6, this is on a Linux system, the menus start with a space between the left side of the browser window and the edge of the menu instead of flush with the leftside browser window as is the case with Firefox. Is there a way to compensate for this behavior without trashing the display in Firefox? The more I learn about web development the more I loathe Microsoft and IE.Copy & paste the code below to embed this comment.
Miguel Beltran (article author)
Someone know a menu like this?
Option1 | Option2 | Option3
option2.4 >option2.3.2
The current no have option2.3.1Copy & paste the code below to embed this comment.
Isaac Z. Schlueter (article author)
In my opinion, CSS has not yet reached a stage where it can gracefully handle complex behavior like nested drop-down menus.
This is most evident in the example if you hover over the right-most parent ("Digital") and then quickly move to the left-most child ("Xenakis"). If you can do this quickly without losing the "Digital" menu items, then you're more dextrous than the vast majority of mouse-users.
The CSS :hover pseudo-class simply has no tolerance on most browsers for any accidental mouse jittering. It would be nice if it could be specified with a given timeout, for example "ul:hover(5)", but alas, that is not available - and perhaps it shouldn't be. The purpose of this pseudo-class is to simply highlight an item when it is clickable, not to provide complicated behavioral scripting capabilities. CSS is a brilliant language for style, but every "CSS Behavior" hack that I see just seems to be a stretch for no purpose other than showing off what is possible.
(Granted, that's a fine purpose and something that should be done in the name of innovation, but it's not a good methodology for creating accessible and profitable websites!)
A javascript solution, otoh, can easily be created that will use exactly the same degradible XHTML and similar CSS styling. In this way, you can allow your users to hover or click a parent, and don't change it until they hover/click another parent. This is the default application behavior that most users are used to, and it is more forgiving of often imperfect mouse movements.Copy & paste the code below to embed this comment.
Jaywar (article author)
Doesn't degrade either. All you see is the top photo.Copy & paste the code below to embed this comment.
webcoder (article author)
who knows.
It seems I am having problems not with flash
but with multiple lines of drop downs.
drop down1 drop down2 drop down 3
drop down4 drop down5 drop down 6
the list hides behind the <ul> heading below it. is this just a z-index or how the flop am
I supposed to get it to work. any ideas??Copy & paste the code below to embed this comment.
Darren Spink (article author)
v1…Copy & paste the code below to embed this comment.
Jonas Hartmann (article author)
its based on pixles, but even worse it cannot be zoomed. Thats just crap, nothing else.
Dropdownmenus in general are a problem, better use asyncronic server connections (ajax) and refresh menus statically, if you mess around with javascript anyway.Copy & paste the code below to embed this comment.
Leslie Campbell (article author)
Sorry, but this menu isn't working on IE 5.2 Mac. It is working in Safari.Copy & paste the code below to embed this comment.
JL Smith (article author)
What if your menu is centered on a page? How the heck are you supposed to position the sub-navs since this example is crippled by using actual pixels?Copy & paste the code below to embed this comment.
Thierry Koblentz (article author)
"This technique is a bulletproof way to ensure browser compatibility and to maintain usability".
I believe the above sentance should be removed from the article; because IMHO this solution has serious issues:
- poor browser support,
- text is not scalable,
- list items are not accessible in IE when JS is disabled,
- and, AFAIK, tabbing navigation is not possible in any browser.
Months ago, I have published a solution, trying to address each problem:
http://www.tjkdesign.com/articles/dropdown/demo.aspCopy & paste the code below to embed this comment.
Palle Derkert (article author)
I belive my own take on a pure css menu have better usability than this one. No javascript, just css (except for the virtual pagechange, just for the demo) Take a look at:
http://derkert.com/ip3/menu/Copy & paste the code below to embed this comment.
Fred de Sanctis (article author)
As a student I apreciate very much. Send more, please.Copy & paste the code below to embed this comment.
designer (article author)
I tried this and it works very well except the subnavi which disappers immediately when I move the cursor away from a tab. So I can't access the subnavi at all! Do you have a solution for this? Thanks!Copy & paste the code below to embed this comment.
Jack Webb (article author)
I'm still searching for a CSS solution that is compatible accross all (most) OS platforms and browsers. I liked the look of your menu, but when I tried it on OS-X and IE, I get no menus at all!
Mac OS 10.3.9 (Apple's most current), and Internet Explorer for Rel. 5.2.3 (MS's most current and final version)
Anyone else have this problem?Copy & paste the code below to embed this comment.
Roman (article author)
The example at http://www.alistapart.com/d/hybrid/hybrid-4.html doesn't look good after I increased text size in Firefox (Ctrl++) several times.Copy & paste the code below to embed this comment.
Roman (article author)
Your menu behaves badly in Firefox when I increase text size (Ctrl++). Menu items disappear, extraneous lines appear, etc..Copy & paste the code below to embed this comment.
Thierry Koblentz (article author)
Hi Roman,
Re: my menu (http://www.tjkdesign.com/articles/dropdown/demo.asp)
AFAIK, it is possible to use "Ctrl+" three times in FireFox without breaking the layout; this corresponds to more than the "largest" text-size in MSIE.
In any case, I believe it is much better than what the "Hybrid CSS Dropdowns" menu allows ;-)Copy & paste the code below to embed this comment.
Jason (article author)
Probably one of the best css solutions I have seen yet. I love ALA!Copy & paste the code below to embed this comment.
Gerdus van Zyl (article author)
The problem with CSS menus is that navigation is very important and problems with like the flashing effect, cross-browser issues, etc. make it less than ideal.
Another problem I have with CSS only menus is that it tries to do behaviour in CSS for which CSS was not designed. CSS should IMO be presentation only.
Also with XHTML markup, CSS styled but Javascript powered navigation you can do some eye candy like the menus I did for my MXR CMS product. see http://mxdemo.infireal.com/ (P.S: the markup is terrible, its on the todo list)
The menu does a roll-up and fade out effect.Copy & paste the code below to embed this comment.
jc (article author)
I'm having a problem implementing a list in FireFox. When I added the style info into my stylesheet, all of a sudden FireFox stopped recognizing all of the stylesheet from that point down. I can't figure out what's causing this problem. IE can still parse the entire stylesheet, displaying the list properly. (The list is taken from the ALA 2002 article Taming Lists by the way.)
Any suggestions? Thanks!Copy & paste the code below to embed this comment.
Miriam Hendel (article author)
I was just checking out the linked examples and they look fine in Safari, but totally not working in Explorer??Copy & paste the code below to embed this comment.
Dan (article author)
Sorry for a little off-topic, but I'm struggling with one thing, which maybe you know how to solve
I want a very simple horizontal menu, based on list
I've done it, but I wanted it to have a custom bullet, so I used list-style: url(/image.gif); in the ul style declaration
it appeared ok in mozilla, but there is NO image neither in opera nor IE.
well, if I change the image to just 'circle' or 'square' it does not appear in those browsers anyway
Is it possible to to have bullets (custom too) in horizontal menu based on ul ?
it's easy to make it in vertical on, but I have not found any example of such menu turned to horizontal…
thanksCopy & paste the code below to embed this comment.
raleigh (article author)
I am in the process of setting this up and I can't get it to center on the page like the rest of my page does. I have a container div around my whole page with margin-left and margin-right set to auto, but the secondary nav is always left aligned. Anyone know a remedy?Copy & paste the code below to embed this comment.
Daniel Pedersen (article author)
I like this example… :) what is to say..Copy & paste the code below to embed this comment.
Manao (arterrien) (article author)
I was working several mothes ago on a similar NAV on a client site http://www.cfatb.com/ using extensively the sluckerfish inspiration.
I enhanced it to fit our requisites and it seems that it works good on many major browsers. Of course the CSS is free to use as well as the HTML code itself. I think I made some mistakes but it works pretty well.Copy & paste the code below to embed this comment.
- Sorry, commenting is closed on this article.


text:
Stay two (2) nights and earn:
•500 bonus Starpoints® per stay
•$25 resort credit per stay
Book online, or call (866)-716-8108 and mention rate code LAPKG1.
Boulevard Kukulcán Km 12.5 Lt 18 Zona Hotelera • Cancun, Quintana Roo 77500 • Mexico • Map
Overlooking the turquoise Caribbean Sea, The Westin Lagunamar Ocean Resort Villas & Spa enjoys a tranquil setting along a beautiful, unspoiled beach. Intuitively designed to suit your personal needs, our five-star resort will refresh your spirit while placing you only minutes from Cancun's energetic nightlife. Experience the villa difference, featuring just-like-home conveniences, including fully equipped kitchen/kitchenettes, in-villa washer/dryers, spacious living and dining areas, and complimentary Wi-Fi. Relax on the private beach, refresh at the Heavenly Spa by Westin™, or rejuvenate in the world class fitness center. The FUN team has daily activities for guests of all ages to enjoy, and the different restaurants on property have offerings to match everyone's tastes. Explore all of our special offers below to find the one that best suits your needs.
Book our best rates, guaranteed. AAA/CAA & AARP Member Exclusive Offers
Deals & Packages for Mexican Residents
Stay two (2) nights and earn:
•500 bonus Starpoints® per stay
•$25 resort credit per stay
Book online, or call (866)-716-8108 and mention rate code LAPKG1.
Special perks for Starwood Preferred Guest® members:
*35% discount is taken off of RACK rates. Best available rate will be given if lower than 35% off RACK.
Book online, or call (866) 716-8147 and reference rate plan SPG35B.
Not an SPG Member? Join today and discover just how rewarding membership can be.
Redeem Starpoints for stays.
Book a studio villa for as little as 20,000 Starpoints per night or a spacious one-bedroom villa for as little as 22,500 Starpoints. When you stay four nights, the fifth night is complimentary.
Combine Starpoints and cash to stay in Cancun.
You can use as little as 10,000 Starpoints and pay $180.00 USD plus tax in a studio villa, or 11,250 Starpoints and pay $230.00 USD plus tax in a one-bedroom, one-bath villa.
Redeem Starpoints for stays
Combine Cash & Starpoints
Not an SPG member? Enroll now at SPG.com
This information enables us to identify the rooms that will best accommodate your party and to prepare for your arrival.
See room terms and details for information about rollaway and/or extra person charges.
Please note that at most Starwood hotels, guests 17 and under are considered children. All other guests are considered adults. You will be told of any hotel-specific differences in this policy on the following page.

subset: commoncrawl


text:
Ashton Kutcher is channeling his best Steve Jobs in the first photo released from the upcoming biopic jOBS.
The film will follow the late entrepreneur's career from hippie to successful business man. The still photo features a '70s-era Kutcher portraying Jobs during his early days developing the first Apple computer. The film, set to close the 2013 Sundance Film Festival, is based on the bestselling Jobs biography written by Walter Isaacson.
In memoriam: Celebrity deaths from 2012
Jobs died in October 2011 at the age of 56 after a long battle with pancreatic cancer.
View original Photo: Check Out Ashton Kutcher as Steve Jobs at TVGuide.com
Other Links From TVGuide.com
- Ashton Kutcher
- Steve Jobs
Comments are currently unavailable on this article
Location, ST | website.com


text:
Showing 97-192 of 288 items found in Shopping
- Sort by:
Fly Bird is a gift boutique filled with curious items for the happy home, body and mind with an emphasis on fun and design. Fly Bird offers a selection of carefully curated items from around the world as well as local designers. Stop by if you're in need of a fun place to shop!
CITY:Oak Park
A one-of-a-kind gallery featuring American artists in a variety of monthly thematic shows. The shows feature Santas, angels, witches, arks, cats, dogs, and more. Also featuring country antiques and vintage jewelry.
Forest Park Chamber of Commerce & Development
The Forest Park Chamber of Commerce & Development is dedicated to the continued growth and revitalization of Forest Park's business districts as well as the enhancement of quality of life for both businesses and residents. Investment in the Chamber partners you with a comprehensive group of business owners and residents throughout the community who want to be involved, stay informed and work together towards making Forest Park an even better place to live, work, shop, dine and play. We invite you to join us!
CITY:Forest Park
Forever 21 offers the newest fashion trends for women and men at reasonable and affordable prices, so everyone can be fashion forward.
Located on Chicago's north side, found-vintage living is a lifestyle store specializing in vintage furniture, barware, lamps, art and accessories. Serving as Andersonville's destination for affordable vintage pieces, it is a haven for authentic home décor from the 50s, 60s and 70s.
Front Street Downtown Wheaton
Fun Inc. is a manufacturer and wholsale distributor of magic tricks and gag novelties. Our knowledgeable and experienced factory staff, most of whom have been with the company for over 20 years, take pride in paying attention to the smallest details. This makes accurate fulfillment of orders and timely shipments a top priority.
Gallery 200 is fast becoming a haven for art lovers as a quality destination for buying and browsing great local art. The gallery, a cultural initiative supported by the City of West Chicago, hosts artist opening receptions, art talks and workshops.
CITY:West Chicago
The gallery's mission is to continue to expose the art community and provide a portal to fine art and artists of different parts of the African Diaspora. A collaborative of artists, collectors and art administrators who have come together to create a unique art experience, and ensure fine art has a place in the rebirth of Bronzeville.
Soho-style art gallery featuring contemporary art that is thought-provoking as well as aesthetic.
Seasonal flowers and vegetable crops will be supplemented from the kitchen with soups, jams, pestos, breads and muffins. Please visit our market, kitchen and garden when you come to shop, it's a lovely trip worthy of time spent in a most beautiful place. Open June through October.
CITY:Lake Forest
Visit the Garmin Store for a hands-on experience with the latest in GPS technology. Rent select automotive and fitness devices and try before you buy.
Garrett Popcorn Shops are a third-generation family-owned business specializing in a variety of tantalizing flavors of popcorn. Featuring caramel crisp, which has been dubbed "the best in the world."
A European-inspired toy shop, Geppetto's offers "unplugged" toys that encourage imagination and creative learning. All products are safe, sustainable, and fun! With free gift wrapping, concierge shopping service, and an attentive staff, it's easy to get just the right plaything for the kids in your life at Geppetto's.
CITY:Oak Park
Goebbert's Pumpkin Farm and Garden Center
Fall: festival with haunted house, corn maze, farm animals, and more. Spring/Summer: large selection of annuals, perennials, vegetable plants, trees, shrubs, aquatic plants, roses, planters, and gourmet food items. Admission is free - cost for some activities.
CITY:South Barrington
Candy and gourmet chocolates, party bags, balloons, beanie babies, and a variety of gift items.
When was the last time you visited a bread store that made everything from scratch? It's the ultimate experience! Owner, Dave Schaps, and his crew start by milling wheat fresh every day at 4 a.m. and baking it into big, beautifully designed loaves. The handmade bread making process allows you to get the best tasting bread on earth. Most of the basic breads are guaranteed fresh for 7-10 days. Specializing in whole-wheat, handcrafted breads made from scratch. There are delicious sweets and treats made fresh daily.
Green City Outdoor/Indoor Market
Green City Market is Chicago's only year-round farmer's market promoting local, sustainable farmers, producers and chefs by connecting them to the public through educational programming and special events. Enjoy the Outdoor market May through October.
Gucci carries everything from men's and women's clothing and shoes to leather goods, luggage, jewelry, timepieces, silks and eyewear.
One of Chicagoland's largest antique malls offering exceptional service and top quality antique merchandise - true antiques - no crafts or new collectibles. The spacious 24,000 square foot building is home to 200 dealers featuring a range of items.
With more than 200 manufacturer and retail outlet stores offering up to 70% off, serious shoppers flock to Gurnee Mills. The diverse variety of stores includes Bass Pro Shops, Saks Fifth Avenue Off 5th, Nike Factory Store, Gap, Last Call by Neiman Marcus and Levi's. Dining options include Rainforest Cafe or a quick bite at one of the two food courts. Non-shoppers can check out Rink Side Sports and Entertainment Center for ice skating, arcade games and laser tag, or catch a movie at Gurnee Marcus Cinema.
Trendy, high-quality fashion at great prices from this European chain with a definite flair for chic.
Premium imported cigars, Davidoff White Label Merchant Humidors, lighters, pipes, and specialty cigarettes and accessories. On-site smoking lounge with multi-media entertainment.
CITY:Rolling Meadows
Enclosed shopping center, just north of Oak Park. Featuring over 100 stores, including Carson Pirie Scott, Kohl's, Target and Best Buy.
Hawthorn Mall is home to Macy's, JCPenney, Carson Pirie Scott, Sears and over 140 diverse specialty retailers including: Bare Escentuals, Banana Republic, Barnes & Noble, Disney Store, Gap, LOFT, H&M, Mario Tricoci Day Spa & Salon, Teavana, and Victoria's Secret. Ruby Tuesday and a food court offer over 20 eatery options.
CITY:Vernon Hills
Heinz Orchard is only 37 miles from downtown Chicago making it the closest apple orchard to Chicago. There are a number of different apples to pick from: Golden Delicious, Empire, McIntosh, Jonathan and Red Delicious. If you're looking for something different to do, without traveling too far from home, this is a great orchard to check out.
CITY:Green Oaks
It's not just a bike shop, and it's not just a coffee shop—it's an artistic space, a working space, a space to live in. They encourage everyone to bring suggestions and feedback; to bring their kids, or their laptops, or both; and to make new friends by elbowing into the community table. Everything they do is centered around this sense of community, right down to their manufacturing. Heritage bikes are designed, welded (by hand, out of American steel), and assembled right here in the city of Chicago. Plus, almost every bike is entirely unique, as Heritage focuses on full customization. Whether it's sparkly colors or Italian leather accessories that float your boat, they'll find something to match your style.
With their signature orange color, this high-end retailer is known for their leather goods, men and women's accessories and jewelry collections.
This engaging retail experience features the full line of Hershey's products, as well as one-of-a-kind gifts and souvenirs Be entertained by the singing baker at the bake shoppe, offering cupcakes, cookies and brownies all topped with Hershey's products.
Nestled in historic homes and buildings that date back to the community's roots in the 1800's, Long Grove's shops specialize in unique gifts, boutiques, antiques, clothing, exceptional art and home décor, and distinctive menus. Visitors can stroll the cobblestone walks that wind through the historic downtown and enjoy seasonal lush gardens and scenic views. And they can make it a quick trip or a day's outing, shopping and indulging their tastes with a variety of food and bakery products, cafés, and fine eating establishments. Fun festivals throughout the year including the famous Chocolate Fest, Summer Fest, Craft Beer Days, Apple Fest and a month of Holiday Festivities to name a few.
CITY:Long Grove
Full service flower and gift shop with an excellent reputation and creative professionals. Extensive offerings including beautiful fresh floral arrangements, long stem premium roses, orchids, green and blooming plants, fruit and gift baskets. Gift Certificates available. Reader's Choice Winner (Best Florist) at Patch.com in April 2012.
The Holiday Shoppe has something for everyone! Enjoy the joy of Christmas anytime at the Holiday Shoppe in historic downtown Libertyville.
We at HouseRed are committed to providing our customers with an educational, enjoyable and cultural experience. Peruse our unique, hand-picked selection of wines from around the globe, ask us about hosting your next party or special event, take a class in the SchoolHouseRed series, attend an educational and fun wine tasting, come listen to live music -- the possibilities are endless!
CITY:Forest Park
I Love Dirt / Cherle Enterprises
At I Love Dirt, we carry everything but the bike! We have unique apparel & accessories for avid motocross & extreme sports competitors and fans. Cherle Enterprises is an innovative full-service advertising & promotional specialty company.
Home furnishings that combine good design, function and quality at affordable prices.
Illinois Artisan Shop - Chicago
Sales gallery/shop featuring the work of over 500 Illinois artisans. Established in 1985, was the first shop of its kind in the state, showcasing one of the most diverse collections of handcrafted work in the Midwest.
Home of Fantasia Confections. Specializing in hand made chocolates, custom confections, dessert tables, gift baskets, corporate gifts, party trays, bulk candy and nuts. The entire store is certified kosher. Vegan, lactose-free and gluten-free products offered.
The name J. McLaughlin is synonymous with classic clothing and accessories for women and men. As a recognized retail industry leader providing high quality clothing based in New York, J. McLaughlin has made homes in 50 chic locales nationwide, serving up classic clothes with an original twist. J.McLaughlin caters to those who enjoy beautifully designed and crafted clothing and accessories.
Immense glass and steel structure, designed by Helmut Jahn, houses State of Illinois government offices and three levels of stores and restaurants in an atrium mall.
Jeanine A Guncheon Gallery Etcetera
An unusual shop that runs the gamut from art, gifts & vintage. Uniquely individual. Owner and artist, Jeanine Guncheon, has a wide collection of her hand painted bowls, furniture, and one-of-a-kind sculptures. Commission pieces on request.
CITY:Forest Park
If you're shopping for that perfect diamond, don't miss the dozens of jewelers who sell their exquisite stones and designs directly to the public from their Wabash Avenue studios. The bargains are incredible.
Considered the "must-have" brand among fashionistas throughout the world, this boutique not only boasts women's shoes, but also handbags, fine leather goods and eyewear.
Kate Spade has hand bags, small goods, paper goods, shoes, baby bags, luggage, glasses, beauty products, jewelry. Jack Spade has work and travel bags, small goods.
Kloeckner Preferred Flowers searches the world for beautiful product paired with decor, design & value-driven services.
La Perla is a leading Italian-based designer of luxury intimate apparel, swimwear and pret a porter.
The annual Lake County Fair runs for five days beginning the last Wednesday in July. The Expo Building is available for rent for meetings, shows, weddings, and events year-round. Monthly events including Antique Shows, Swap Meet, Crafts Shows, Dog and Horse Shows, and much more. Visit the website for event schedule.
Lands' End is a direct merchant of traditionally styled clothing for the family, soft luggage, and products for the home. We work directly with mills and manufacturers, eliminating the markups of middlemen.
Laudi Vidni offers gorgeous leather handbags that can be customized with 40 leathers, 9 linings and gold or silver hardware. $85-$495. Made in Chicago.
The LEGO store features an assortment of products covering nearly every square inch of space. The "Pick-A-Brick Wall", by far the most popular store feature, offers the option to hand pick and purchase specific LEGO bricks and elements in a variety of colors and shapes in bulk. The "Living Room" is an interactive play area prominently positioned in the center of the store, giving consumers a chance to get "hands-on, minds-on" with LEGO products. Finally, a "Brand Ribbon" runs the circumference of the store, featuring LEGO® model displays, company history and fun facts to entertain guests. Guests will find a full selection of LEGO products and branded merchandise for children ages 2 and up, including LEGO DUPLO® sets, toys based on the new feature film The LEGO Movie, and exciting themes such as NINJAGO, Legends of CHIMA, Friends and CITY and popular licensed items such as LEGO Star Wars, LEGO Super Heroes and LEGO The Hobbit.
Lester Lampert, Inc. is a true gem in the world of jewelers. Unlike most jewelry retailers, Lester Lampert provides full service design through consultation coupled with onsite manufacturing giving their customers the utmost participation in creating the perfect piece of jewelry for any occasion.
A cherished landmark in the heart of downtown Wheaton, The Little Popcorn Shop is perhaps one of the most loved and narrowest stores in the Chicagoland area measuring 49 inches wide by 60 feet long. The store's small, quaint space is like walking into a Norman Rockwell painting. Popcorn is freshly popped, candy lines the wall, and locals greet each other warmly while welcoming newcomers to this very special place called The Little Popcorn Shop.
Visit this store and find the latest runway looks, sought-after in-season styles, from real designer names you know. These are the same labels you'll find in the finest department stores, but at Loehmann's they are 30-65% less. Real designers really discounted. Their staff can help you find the perfect outfit for every occasion for the whole family.
This destination specialty store offers stylish apparel and accessories for every occasion-clothing store for creative woman. Located on Central Street in Evanston on a lovely tree-lined street complete with unique boutiques, restaurants and specialty stores.
Celebrating the wonder and innocence of childhood, this charming children's boutique, located in the heart of the Evanston Shopping District, is known for its selection of distinctive clothing, toys, books and gifts for boys and girls (newborn-10).
DuPage County, Chicago's Western Suburbs - Enjoy unique shopping and dining in Historic Downtown Lombard and the beautiful Lilacia Park. Special events for all ages throughout the year. Free parking.
Your sweet tooth is sure to be on alert at Long Grove Confectionary Co. Watch homemade fudge getting made as thick layers of sweet goodness fold into large vats. Inhale the sugary goodness of the famed cocoa concoctions as soon as you walk inside. At Long Grove, the old fashioned confectionary is alive and well, and smelling oh so good.
CITY:Buffalo Grove
Long Grove Confectionery Nut and Candy Factory Store
The former Nut & Candy House is now the Long Grove Confectionery's Factory Store. Along with the store's original kinds of fresh roasted and raw nuts, chocolates, chocolate covered nuts, yogurt covered items, snack mixes and assorted candies, the store will also feature Long Grove Confectionery's famous hand-made chocolates. Bulk, bagged or gift packed items also available.
Louis Vuitton will certainly catch your eye on Michigan Avenue with their signature LV monogram, luxurious leather goods, and avant-garde fashions.
The oldest and largest continuously operating winery in Illinois producing more than 50 varietals and 25,000 cases of award-winning wines each year. Come in for a tour and tasting to experience the finest vintages, gourmet cuisine, and luxurious lodging. Tasting room and gift shop open daily. Complimentary tours on weekends. Gift shop featuring wine-related items, specialty gift baskets, glassware, and elegant home decor. Visit our website for events throughout the year including our renowned Oktoberfest.
Welcome to Lynfred Winery Wheeling, a satellite location for Illinois' oldest and largest, continually-operating winery. Since 1979, Lynfred Winery has been offering guests with great wine, food and lodging. We offer wine tastings, flights, and bottles every day of the week. We have received numerous awards for our wine, and we have countless events that go on throughout the year at the winery. We also have a variety of gift and gourmet food items.
Specializing in unique gifts and affordable luxuries, Lyzart offers a variety of items in every price range. Handmade functional pottery, original photography and paintings, local handmade jewelry, home decor, personal gifts and much more.
Macy's on State Street is a quintessential Chicago experience. As one of the world's largest department store, the State Street location has been a Chicago destination for more than a century. Today, this flagship Macy's store covers an entire city block and features 10 floors of retail space, a variety of unique restaurants, annual signature special events and outstanding visitor services. Macy's on State Street is listed on the National Register of Historic Places and remains a leader in trends and merchandise--from beauty and fashion to home decor and entertaining. Visitors are eligible for 10% Visitor Savings Pass with appropriate identification.
This cozy children's bookstore is located in the heart of Oak Park. It features award-winning books, foreign language books as well as classics, non-fiction and our new graphic novel/manga section. Enjoy the sounds of nature as you browse puppets, dolls, puzzles, games and music from around the world.
CITY:Oak Park
You'll find world-class shopping, dining, lodging and entertainment throughout the Magnificent Mile area. With four shopping centers, renowned boutiques and locally acclaimed designers, Chicago's Magnificent Mile area is a shopper's paradise. After you've shopped 'til you dropped, dine at one of our superb restaurants, see Chicago's famous skyline from the John Hancock Observatory, or catch a show at an area theater.
Great shopping, dining and professional services are waiting for you in our picture-perfect downtown. Enjoy the turn-of-the-century buildings along Milwaukee Avenue or relax among the roses in Cook Park. Downtown Libertyville is a delightfully unique shopping and dining experience. With over 70 shops, boutiques, and restaurants, it's why we say "spend an hour, spend a day!"
Maple Avenue Gallery features sophisticated, contemporary works of art that range in price from about $500 to more than $6,000. In addition to the gallery, the company also offers custom framing and art consultations. Every month, Maple Avenue Gallery hosts receptions with live music and refreshments.
Outsmart your age and play your way to a healthier brain! Find the best brain-boosting games, books, and activities to improve memory, coordination, world skills, visual perception, and critical thinking.
Fashion forward designer, Marc Jacobs, delivers unique and contemporary clothing for men and women reminiscent of the fashion of past decades.
Experience Marilyn Miglin's exclusive beauty products. Fragrance. Skin care. Cosmetics.
For over 30 years, the name Mario Tricoci has been synonymous with the latest in hair trends and the most innovative and luxurious spa services and hair salon services. Mario Tricoci is pleased to introduce you to the vast array of sumptuous salon and spa services. Now, take a deep breath...it's time to relax and allow us to indulge and delight you.
Massage Envy Lake Zurich specializes in therapeutic massage. We have a full staff of Illinois licensed, nationally certified therapists who perform a variety of different modalities: Swedish, deep tissue, reflexology, sports, pregnancy and injury massage, to name a few. Our introductory rate of $39 can't be beat. Be sure to ask about our wellness program that makes massage affordable for everyone!
CITY:Lake Zurich
Discover a store with unique ambiance and warmth, nestled in the heart of the North Shore. For over 30 years, Material Possessions has welcomed guests and clients into their gorgeous store. Thought-provoking pieces, designed to ignite the imagination, stir the soul and make a statement are aplenty...and a sense of humor is always at home here.
MaxMara is synonymous with designer fashion, impeccable tailoring, exclusive fabrics and modern yet classic design.
Visit this flea market that is famous for wonderful bargains on everything from tires and tools, to fresh produce and clothing. The market is a Chicago tradition that's held every Sunday.
A fun Evanston children's boutique, sharing cool clothes and gifts for kids 0 to 12 with the whole world!
Tour Chicago's legendary Merchandise Mart, which houses an estimated 1,800 contract and residential showrooms. Guides conduct 1 1/2-hour tours that highlight that Mart's fascinating history, showrooms and design floors. Two floors of stores.
Mickey Finn's Brewery is a landmark casual social gathering place famous for handcrafted beer. Since opening in 1993 as Lake County's first brewpub, Mickey Finn's has won a trophy case full of national and international awards for their beer. The menu offers a variety of items including burgers, pizza, fish n' chips, and buffalo wings. Also enjoy seasonal outdoor dining, a huge banquet facility, carry-out food and beer, live entertainment on weekends and a diverse clientele.
Named best new boutique by Time Out Chicago, Milk Handmade is a women's clothing boutique that specializes in small-run, handcrafted goods. Whether you're looking for the softest tee, the perfect handbag, or your new favorite Saturday-night top, Milk has the one-of-a-kind piece for you. Come on in, hang out, and prepare to fall in love.
Largest Asian market in the Midwest. Fresh take-out sushi available. Grocery, food court featuring seven types of Asian cuisine, bakery, ice cream parlor, travel agency, book store, and liquor store. Events and demonstrations throughout the year. Annual Bon Odori Festival in August.
CITY:Arlington Heights
A small gallery that features unique mid-century pieces. Specialty furniture, lighting, and decor from the '50s, '60s, and '70s. Also offering mid-century art, posters, clocks, and mirrors, as well as quirky accessories.
Montblanc, international maker of sophisticated, high quality writing instruments, also offers exquisite writing accessories, leather goods, jewelry, eyewear & watches. Our products meet the demands of quality design, tradition and master craftsmanship.
CITY:Oak Brook
Morgan Christopher Salon and Spa
Hair and nail service, waxing and make-up, massage.
Creating beautiful fresh flower arrangements as well as blooming plants and European gardens. Work with our design team to create exquisite custom floral for weddings, parties, bar and bat mitzvahs and other special events.
Museum Shop of the Art Institute of Chicago, The
The Museum Shop offers a wide selection of gifts, jewelry, and museum adaptations, many derived from works in the museum's collections or special exhibitions hosted by the museum.
My Kind of Town Tours & Events
This company offers group cultural and educational tours. Reservations are required.
CITY:Highland Park
Specialty gift store offers unique and trendy apparel and accessories for every occasion. Boutique shopping with friendly staff to assist you with your individualized style and flair.
One of the nation's leading fashion specialty retailers, offering an extensive selection of contemporary and classic shoes, clothing and accessories for the entire family.
Nordstrom, one of the nation's leading fashion specialty retailers, offers its Michigan Avenue customers 271,000 sq. ft. and four levels of contemporary and classic shoes, clothing and accessories for the entire family. A wide range of special services and amenities are available, including personal shoppers, concierge, in-store alterations, shoe shine and free delivery service.
Over 130 fabulous stores featuring the latest fashions and trends, including Carson's, JC Penney, Sears and Forever 21. A new Classic Cinemas opened in 2008 showing great movies. Conveniently located on Cermak Rd., west of Harlem Ave.
Northbrook Court is home to a powerful anchor alignment: Neiman Marcus, Macy's, Lord & Taylor and a free-standing, 36,000 square foot Crate & Barrel Home Store. Also featuring BCBGMAXAZRIA, Cole Haan, CUSP, Tommy Bahama's, Louis Vuitton, Ralph Lauren, Burberry and Elizabeth Arden Red Door Spa. Dining and entertainment options include P.F. Chang's, Stir Crazy, Di Pescara, and AMC Theatres providing 14 screens.
We sell only products made in the United States! We offer an eclectic mix of common household items from toys to tools, glassware to garden supplies, fashions to food and so much more. When you shop at Norton's U.S.A, you help keep America working!
For 35 years world famous Chicago icon offering popcorn, nuts & fine chocolate. Also located at O'Hare & Midway airport & Union Station. Order online.
A unique collection of galleries, boutiques and restaurants on Harrison Street from Austin Blvd. to Elmwood Ave. in Oak Park, Illinois. Find one of a kind apparel, art, jewelry, beads and home accessories. Have a meal or a snack or specialty coffee drinks at the Buzz Café, or a meal and a cocktail at Trattoria 225. Dance and exercise studios, healing arts businesses, and hair salons are among the district's offerings. The nine blocks feature painted artist benches and public art throughout. Convenient to the Austin Blvd. exit from the Eisenhower Expressway, the Austin stop on the CTA Blue Line and Stop 17 on the Free Shuttle. Gallery hours vary -- call or check website for more information.
CITY:Oak Park
After 5 years of having a showroom and retail store on Oak Park Avenue, Oak Park Home & Hardware has recently become an "Internet only" based business. Oak Park Home & Hardware (OPHH) has become quite well known nationally as one of the premier businesses specializing in Lighting, Furniture, and Home Accessories in the spirit of Arts & Crafts, Mission, Prairie, Tudor, and Art Nouveau. We do offer design services and will assist customers in specifying appropriate products for their home(s). Have a look at our web site. You can order online!
CITY:Oak Park
Visit us for maps, books, souvenirs and unique gifts. Tickets are available for Hemingway's Birthplace Home and Museum, Historic Pleasant Home and The Historical Society of Oak Park & River Forest. Purchase other seasonal special events tickets here.
CITY:Oak Park
After the Chicago fire of 1871, many wealthy Chicagoans contracted European-trained architects to build new homes and mansions on the City's Near North side. Oak Street soon became the center of the expanding Gold Coast neighborhood and home to some of Chicago's most prominent families. With the turn of the Century, skyscrapers began to grow along neighboring Michigan avenue, but Oak Street retained its historical brownstone character and intimate scale, combining glamorous style with cozy informality. Today Oak Street has become an International style center, housing many of the world's most exclusive boutiques and salons. It is a street which attracts shoppers from all over the world who seek only the best. Oak Street has become a true "destination", a street of dreams where excitement is generated by sophistication and great taste.


text:
The second-to-last Twilight movie, Breaking Dawn, Part 1, officially comes out tomorrow, but of course there have been midnight screenings all week. And just like with the Harry Potter movies, there are hundreds of fans willing to wait it out in the freezing cold to be the first to see Bella and Edward's wedding, vampire fetus, and werewolf feud.
In perusing photos of the Twihards, we started to notice that their makeshift tent cities resemble the Occupy Wall Street protesters before they got pushed out of Zuccotti Park. Test your knowledge of politics versus fandom with our quiz! (Answers at the end.)


text:
Directions to OH Casa SintraAddress: Rua Gago Countinho 2, Sintra, Portugal
Average rating: 94%
Rooms from: US$ 0
Directions to OH Casa Sintra
Sintra has really good transport connections from Lisbon. By train from Lisbon (40 minutes) There are cheap trains leaving every 20 minutes from Rossio Train Station. From Rossio, catch the Sintra train all the way to Sintra Station (the final station - not Portela de Sintra which is the second to last station). By train from Lisbon Airport (1 hour) Take the Red Line (linha vermelha) Metro from the Airport to Oriente Station. At Oriente change to the train (comboio) line and ask for the next train to Sintra - sometimes there is a direct train, other times you will need to catch a train to Cacém Station and swap to a train going to Sintra. From Sintra Station (4 minutes walk) Exit the 'Sintra' Train Station and turn right on Av Dr. Miguel Bombarda. About 250m from the station the road curves to the right and turns into R. Dom Francisco de Almeida. Follow R. Dom Francisco de Almeida for about 100 m until you reach rua Gago Countinho. The big beautiful green house you see on your right is us. Come on in! By car from Lisbon Airport to Oh Casa Sintra If you come by car, don't forget to reserve your free carpark! Drive out the airport and get onto the IC 19. Drive all the way to Sintra which is about 25km away. Stay on the IC 19 until it becomes the N249 (Rua Elias Garcia). At the round about (you will see a big BP gas station), take the first exit. At the next roundabout, also take the first exit (Largo Chão de Meninos), follow it for about 1,2 km. Continue onto R. Dom Francisco de Almeida (you will pass by a small BP gas station) until Rua Gago Coutinho appears on your left. We are the green house (No 2), just park in front of the gate. Come on in! Note that there are two Rua Gago Coutinhos in Sintra, so if you're using a GPS it is better to use the coordinates 38.800442,-9.382597


text:
Sakroots Flower Power Rain Boot
Sorry, this item is sold out!
Looks like you've got more shoe shopping to do - have fun!
Looks like you've got more shoe shopping to do - have fun!
Item # 247121
Make a splash in the Flower Power Rain Boot from Sakroots! This bright print will bring a smile to your face on a rainy day!
- Waterproof rubber upper
- Adjustable buckle
- 9" shaft height, pull on
- 14½" calf circumferece
- Rubber sole
- Imported
By: Kohlerbear
Location: FL
January 20, 2013
Comfy and cute
"Haven't worn them for an extended period, but I love the way they look and they were super comfy when I wore them around the house. Run just a bit long. My typical size is 9.5, but I got these in 9 and they fit great!"
By: MtnSk8tr
Location: Vancouver, WA
December 26, 2012
Rainy day cheer
"Super-cute rain boots that combine fashion and function. The cheerful print is reminiscent of Peter Max.I agree with other reviewers who noted they do run run short: I typically wear a 7.5 or 8; a 7 was a perfect fit. The slightly short height and side gusset provided a perfect fit for my "athletic" (large) calves."
By: Ovelia
Location: Illinois
December 06, 2012
Rain, Rain, go away!
"I ordered these for my daughter and she absolutely loves them. They are super cute and does what rain boots do, keep your feet dry. The colors are very vibrant and eye catching."
By: ESBN
Location: Virginia Beach
November 01, 2012
"Cute rain boots! Have received many compliments on them!"
Click anywhere to close this.


text:
|Posted by Stephen on April 08, 2003 at 17:50:19:
The double kitchen sink does not drain. It takes approx. 1 gallon of water before the water backs up into both sinks. I have used a 20ft snake, various drain chemicals, to no effect. Also, have used a plunger, where I sucked up 50 acorns, into sink trap. A friend told me to check air vent on roof. So far, I have removed about 2ft 6" of acorns from air vent on roof. Using a steel wire, and power drill to loosen. Then using tubular pipe to trap acorns into pipe, and remove. I think I still have about 2 ft left before clearing pipe.
Once the air vent pipe is clear, should that solve the draine problem?. Or do I need to look elswhere for blockage. My Friend alo told me, that all drainage pipes lead into one main pipe then to septic tank.
I come from Australia, this is all a new thing for me,where air vents and water drainage pipes work together. We don't have such things "Down Under".
|Replies to this post


text:
Since 1996, the Paramedic Program at LaGuardia has enjoyed a rich history of developing many of New York City's finest paramedics. We have had 11 years of 100% pass rates on the NYS Department of Health Paramedic Certification Exam.
Benefits of attending LaGuardia's Paramedic Program:
• Choice of one year certificate or two year AAS degree educational tracks • Excellent reputation within the NYC EMS community • Lower tuition and available payment programs • State of the art equipment and EMS labs • Knowledgeable and experienced faculty • Innovative skills training • Comprehensive curriculum • National, state and regional certifications for paramedic • Convenient access to mass transit and major highways • Clinical rotations in Manhattan, Queens, Bronx, and Brooklyn • Unwavering professionalism and caring attitudes of staff
With the excellent reputation and experience our program offers, it's clear why you should make the LaGuardia Paramedic Program your choice for EMS education, I look forward to helping you advance your career to the next level.
Matthew Smith, EMT-P Paramedic Program Coordinator
Related Programs


text:
The site is maintained by the Administrative Office of the United States Courts on behalf of the Defender Services Office.
To provide comments or suggest improvements to this website, call or email the Legal and Policy Division Duty Attorney, 202-502-3030 or firstname.lastname@example.com.
The purpose of this site is to function as a clearinghouse for information about the Criminal Justice Act and the National CJA voucher process.


text:
Known for their bold pop graphic prints and designs this fun, quirky, and in-your-face label is definitely not for those who want to blend in. In fact, if your goal this spring season is to stand out and be noticed then Lazy Oafs is totally for you. Aside from it being an amazingly rad collection, we're really digging the over-the-top pattern-clash styling with the perfect hints of denim. If you're not fully confident on how to mix contrasting patterns (we feel a styling roundup coming on) then try Lazy Oafs t-shirt dresses for the perfect attention-getting and easy to wear outfit. Add a denim jacket and a cute pair of wedges and you're good to go. Pattern and denim? Clearly its a win-win situation!
[nggallery id=165]
—Sandoval Gomez
Tags: denim jacket, Lazy Oafs, Lazy Oafs Spring 2011, LookBook, pattern-clash looks, pattern-clash style, pop graphic designs, pop graphic prints, t-shirt dress


text:
Top Definition
Spending the night at home with a few of your mates playing in the Nintendo Wii
Me and Craig arn't going down the pub tonight....were going round his house to spend the Wiivening in!
by Mike Breakwell January 26, 2009
The Urban Dictionary Mug
One side has the word, one side has the definition. Microwave and dishwasher safe. Lotsa space for your liquids.Buy the mug
The Urban Dictionary T-Shirt
Smooth, soft, slim fit American Apparel shirt. Custom printed. 100% fine jersey cotton, except for heather grey (90% cotton).Buy the t-shirt


text:
Like us on Facebook!
Subscribe to our YouTube channel!
Cleaning Light Filtering Fabrics:
The Comfortex Symphony® double honeycomb fabric is easy to care for. Regular dusting with a feather duster or vacuum cleaner brush is recommended. Most stains can be blotted with a damp sponge and mild detergent. For problem stains, the shade can be removed from the installation brackets and soaked in warm water. When damp, raise shade tightly to recrisp pleats. Before using anything stronger than mild detergent and lukewarm water, test an unobtrusive corner of the shade.
Cleaning Blackout Fabrics:
Symphony® Blackout fabric is easy to care for. The fabric can be dusted with a soft, clean cloth, feather duster or lightly vacuumed with a soft brush attachment. To spot clean, use a cloth or sponge dipped in a light solution of lukewarm water and clear dish detergent and lightly dab. Do not scrub the surface. Rinse thoroughly. Complete immersion in not recommended.
For additional advice on care or cleaning, please contact our Technical Service Department at (800) 843-4151.