Centering Sticky Menu

[dmwhipp]

Hello,
I'm just now starting out with responsive sites and am using Responsee framework since it seems to not be as bloated as some of the other systems out there.

Right now, I'm trying to figure out how to center the menu and keep it centered when the sticky menu appears as you scroll down the page: http://dwwebdesigns.com/cisnew/

I somehow got the sticky menu centered here: http://dwwebdesigns.com/cis/index2.html. However, I'm not sure how I did it. That template include several thousand lines of CSS which seems ridiculous, especially since I don't understand much of it.

Any help with this would be appreciated.

Thanks,
Deborah

[jscheuer1]

Not sure how this will work out with everything else, but it centers the menu items. Get rid of float and add display: inline-block to (around line 90 in cisnew/cisstyles.css):


.top-nav li {
/* float:left; */
list-style:none outside none;
cursor:pointer;
display: inline-block;
}

And add text-align: center to (same file, around line 751):


nav.fixed, .fixed nav {
padding: 1em 0;
text-align: center;
}

Oh, and I think you may also want to add this style to the stylesheet (to keep the current look for the drop downs):


li.submenu li {
display: list-item;
text-align: left;
}

[dmwhipp]

Hi John,
You've helped me so much over the years so, if you have the time, I would appreciate your advice.

I am going to go ahead and learn to code responsive sites. I looked around for weeks trying to find the best way to do this and ran into so many different options and opinions.
It appears that frameworks like Foundation and Bootstrap seem very bloated, though they appear to have pretty good documentation and support.

I ended up going with Responsee since it appeared pretty lightweight and like something I could learn, but it turns out that some of their templates are using multiple stylesheets and more convulated than I realized. Additionally, there's very little documentation and support for it.

I'm wondering if maybe I should move to something even simpler like Pure or Skeleton and then learn each element (e.g. sticky menus, slideshows, galleries, portfolios, etc.) to add to it. I don't think it's necessary for me to create my own grid system since so many have been written by people with more knowledge than me, but I've been struggling to determine the right direction to take with this.

If you happen to have any opinions on the subject, I would definitely value them.
Thanks,
Deborah

* EDITS *
Actually, after looking again at Skeleton I'm seeing it has a max width of 960 (http://getskeleton.com/), and I definitely would like to create some sites in larger widths such as 1140. And Pure's default menu is vertical (http://purecss.io/) and the majority of my clients want horizontal menus with drop downs. This is so frustrating.... I've been reading up on this for months and trying to find something to work with and learn and I keep running into things like this.

[jscheuer1]

You're actually way ahead of me on all that if you can believe it. My main focus is troubleshooting javascript. Along the way I've gained a working knowledge of css that allows me to troubleshoot it as well (usually), but I don't design sites and haven't read up on the things you're mentioning. I would say that the simpler the better. One thing you mentioned was vertical menus versus horizontal ones. Vertical is good because it has a better chance of being accessible to mobile devices. There are menus that change from horizontal to vertical based on screen size using either css media queries or javascript. DD has at least one of these. I was just looking but can't seem to find one right now. As you know, the library here is quite extensive.

[jscheuer1]

Beverley usually has good ideas for design templates and such. She's not always around but does check in from time to time. I'll PM her you're interested and give her a link to this thread.

[dmwhipp]

Hi John,
I appreciate the assistance. At this point it looks like I still have tons more reading to do, as well as finding some online tutorials. I'm sure I'll be back here for more help.
Thanks again,
Deborah