Our department's web page has a menu on the left-hand side of every page. We have recently been getting complaints about users not being able to find what they want on our page. I found that most complaints were regarding pages that had links in this menu. I think the problem is that the menu is so cluttered and full of links that users tend to skip over the menu altogether and just look for the link either in the tabs on the top or the main body of a given section's index page. The problem is that I cannot add, take away or change the wording on any of the links in the left menu, and spacing them out more with manual break or paragraph tags would require the user to scroll forever to find a link. That's not useful! I would like to space out the menu by adding maybe 3-4 pixels of padding between each link. When I added padding to the 'a.menu' tags in my CSS file, it just moved the actual clickable area around, not the text. This looks incredibly funny when you point to a link and the one underneath it changes according to the 'a.menu:hover' style! What am I doing wrong? Any better suggestions for doing this? The links are as follows: Main page: http://www.unm.edu/~hr/ CSS file: http://www.unm.edu/~hr/hr.css Also, if you see anything else that would make this page better, please don't hesitate to let me know. A few things: 1. Color scheme cannot change. 2. Dang door and logo cannot change. The most important thing right now is the CSS for the menu, but comments and criticisms are always welcome. Thanks!
i can't see anything wrong with the menu, but it might be useful to add a line-height attribute of 120% or so to space them out. also check what browsers the user are using to make sure the css is recognised... gl, and let us know how it goes.
Using % on the line-height attribute didn't have any effect, but setting it to line-height: 16px; font-size: 12px did. I'm still tweaking it and will reply back when I've got it to where I want it. Thanks for your help!
I'm not too fond of the layout, what moron came up with the graphics anyway? Kind of a lame door too.... I'd say chunk the whole thing and go all CSS, then if someone doesn't get the page the way they want it, they should upgrade. Your co-workers probably all use new enough browsers and would never notice the difference. I'd also suggest changing the link text about 2 shades lighter. And can we make it more webbish? But not too webbish... All joking aside, I can't believe the let you keep the fisherman! I think the drunk cat was better for management though! For those who don't know, I used to work alongside Arthur2Sheds, and the office was pretty demanding of rather simple and illogical things, so I'm just joking/venting, but more joking, because the people there are great... they just don't appreciate good, standards-compliant web design. I'm starting up a regime to overthrow the CIRT and set up the servers with PHP/MySQL, and the "not broken all the time" feature... for those who want to join.
Hey, I like that idea! How long will that take? I'm going home for the day and won't touch this until Monday, but I appreciate your help, Jazzle, and will let you know when I have something presentable. Oneseventeen, who let you out of your cage?
Is the % a measure of the percent of the character height? Because, if so, it could be that the default line-height was around 120%, and therefore wouldn't look any different. I haven't tested it though, I could be completely off.
I think the reason % didn't work is because I had the font-height set with pixels. I think it was just a matter of consistency. I don't think it likes switching from one to another. Okay, now the problem I'm running into is that two of the links are more than one line long, so the space between each of the words is just as much as it is between lines with hard breaks. I tried defining them differently in the CSS file, but got no change. "Main Campus Consultant Groups" and "Training & Organizational Development" both take up more than their share of the sheets. Any suggestions?
That's an idea, but I don't see how the CSS file would treat <ul> classes different from <p> classes. I also don't want bullet points. Can I do that with CSS? Thanks, by the way.
Sure, just put in li.menu: PHP: list-style:none; Some other useful links: http://www.accessify.com/tools-and-wizards/list-o-matic/list-o-matic.asp http://css.maxdesign.com.au/listamatic/
I just gave up and threw in an image spacer to space it out correctly. Does it look funny to anyone? Thanks. Michaeln3, thanks for your help.
nope, looks good i'm sure it must be possible to do, have vague recollections of being able to do things to .firstletter (or something that affects just the first letter, can make 'drop-caps') glad it got sorted anyway.