Last post Dec 22, 2006 09:34 PM by devinmccloud
Dec 21, 2006 05:01 PM|Whozurmommy|LINK
Okay, I've downloaded the examples and
followed the steps to create a basic page with one menu. However my results look nothing like what is shown in the tutorial:
And here is what I get:
I admit I'm new to ASP.NET, and perhaps these adapters were not built for beginners like me, but I do want to build a CSS friendly website, and so I'd like to use these.
The documentation is REALLY lacking on the specifics of how exactly to install and start using these "adapters". I've read through the tutorial and the whitepaper and they really gloss over what is really happening in the background...so
its difficult for me to know if I have this installed correctly or not. The examples work, but when I attempt to
create a new page and add a menu it looks like crap. Also, when I look at my code CssSelectorClass has a green squiggly underline with an error reading "Attribute "CssSelectorClass" is not a valid attribute of element 'Menu'. It appears to be working
because if I look at the source for my page it does build the menu using bullets (ul and li), but it doesn't appear to be finding the CSS files correctly. I'm building my page right from within the example website (the tutorial didn't explain
where to build your test page), so all of the files should be where they are needed. I found
this thread that might also be related but I'm not sure.
Any help is appreciated, -=STZ=-
"css friendly adapter"
Dec 22, 2006 11:13 AM|Russ Helfand|LINK
After we finish the immediate task of getting you to be productive with these adapters, I'd like to ask that you help me better understand where we could add to the docs. Clearly you are frustrated with the lack of direction you found in them. I'd like
to reduce that frustration for folks in the future by taking advantage of your experience to learn how we can improve things. For the moment, though, let's put that aside and try to get you up and running and productive ASAP.
It's terrific that you've already read the docs that come with the kit: the white paper and the tutorial. There are two spots I'd suggest that you return to and study again:
Often, when people say they can't get their adapted menu to work right it's because of one of just a small handful of possible reasons... all of which are easy to fix. Let's run through some things you can check right away.
First, open the problematic page in a browser and do a "view source" so you can look at the final HTML. Up in the <head> it's really important that you locate some <link> tags that, if absent, cause lots of problems. These critical links will look something
<link id="ctl00_AdaptersInvariantImportCSS" rel="stylesheet" href="CSS/Import.css" type="text/css" /><!--[if lt IE 7]> <link rel="stylesheet" href="CSS/BrowserSpecific/IEMenu6.css" type="text/css" /><link rel="stylesheet" href="CSS/BrowserSpecific/IEDefault6.css" type="text/css" /><link rel="stylesheet" href="CSS/BrowserSpecific/IECultureMaster6.css" type="text/css" /><link rel="stylesheet" href="CSS/BrowserSpecific/IEBannerMenu6.css" type="text/css" /><![endif]-->
It's a good idea, of course to also make sure that you actually have a CSS folder and that it has a BrowserSpecific subfolder and that folders contain the appropriate style sheets. If you are using VS to create your web site and web pages then you can create
a "starter" web site that is CSS friendly and has all the right files in all the right folders by following these directions,
For your menu to work, you'll also need at least some styles defined in a style sheet that sets up the menu's widths, colors, etc. The kit gives examples of these sorts of styles in its two theme folders (Basic and Enhanced) as well as a very simple menu
style sheet in the WalkThru folder. If you haven't yet, you need to make your own version of these sorts of styles and link them into your page either explicitly (with a <link> that you add to your markup) or by putting them in your theme folder.
OK, speaking of themese... there is a VERY common problem that authors run into when using VS to build web pages.... when you create a new web page, the ASPX file's default @Page directive does NOT specify any Theme attribute (or the nearly equivalent StyleSheetTheme
attribute). Check that your ASPX file's @Page sets Theme or StyleSheetTheme if you are counting on your page picking up the CSS files from some particular theme folder.
Finally, you need to use care about if/how your <asp:Menu> sets the new CssSelectorClass. You already noted that the VS editor puts a squiggle under that attribute. I'm afraid you have to ignore that. For the moment, the important thing to remember is
that the CssSelectorClass you use determines the first part of each of your CSS rules for your menu. So if you use a CssSelectorClass of foo then your menu rule selectors for that menu should begin with ".foo" and then continue with the rest of the rule's
selector. For more info see,
Good luck with all this. Please write back and let Heidi and I know how you are doing. Happy Holidays!
Dec 22, 2006 09:34 PM|devinmccloud|LINK