Changing bullets from squares to circles

• 

  jpiller3 · Member · Mar 30, 2014 at 2:39 pm

  • Copy link
  • Add topic to favorites

  I’m using Basis theme and I’d like to change the bullets from squares to circles. I tried the following CSS but it didn’t seem to work. Any suggestions?

  ul li {
  list-style-type: circle;
  }

  The blog I need help with is: (visible only to logged in users)

• 

  jpiller3 · Member · Mar 30, 2014 at 3:08 pm

  • Copy link

  I also need to change the hover color of my main nav links to red. I tried the following CSS but nothing changed.

  .main-navigation a:hover {
  color: #FF0000;
  }

• 

  jpiller3 · Member · Mar 30, 2014 at 3:47 pm

  • Copy link

  Another thing I need help with is the alignment of the logo and main navigation menu. Option 1: Move the logo up so it is more aligned with the menu. Option 2: Drop the navigation down so it is more aligned with the logo. What CSS could I use to accomplish that?

  Once I figure that out, I’d like to add a horizontal line that spans the entire width of the screen below the logo/nav and above my page content. Is that possible?

• 

  jpiller3 · Member · Mar 30, 2014 at 4:16 pm

  • Copy link

  One last thing… My client decided that they now want child pages to appear in the main nav as a dropdown menu. I know this is possible within the Basis theme, but I cannot for the life of me figure out where it is. I may have even disabled it at some point because I didn’t think they wanted it. Can you point me in the right direction?

• 

  jpiller3 · Member · Mar 30, 2014 at 5:16 pm

  • Copy link

  Nevermind about the dropdown secondary navigation. I figured it out.

• 

  jpiller3 · Member · Mar 30, 2014 at 11:14 pm

  • Copy link

  I figured out the bullet thing.

  To make this less confusing and condense all my requests into one spot, here are the remaining items I need help with:

  1. Changing the “hover” and “on” state color of my main nav links to red. I’d also like to remove the underline from the “on” state.

  2. Aligning the logo and main navigation so that they line up on the bottom.

  3. (new) Removing the space between the page titles and the header (nav/logo) on each page.

• 

  jpiller3 · Member · Apr 1, 2014 at 4:27 pm

  • Copy link

  I figured everything out except how to align the logo and main navigation so they line up at the bottom. I need to finalize this by EOD tomorrow. Any help/suggestions are much appreciated!!

• 

  designsimply · Member · Apr 2, 2014 at 10:28 pm

  • Copy link

  jpiller3! We usually answer questions starting with the oldest last reply first. So every time you posted, this thread moved further down on the list. But! I see that you figured out a bunch of stuff already — that’s awesome!

  Let me see if I can help you with the last bit…

  2. Aligning the logo and main navigation so that they line up on the bottom.

  Give this a try:

  #basis-header-nav {
  	margin-top: 20px;
  	margin-bottom: -60px;
  }

  It adjusts the spacing a little too, so it might not be perfect depending on what your end goal is for the height for the header area. Try adjusting the numbers if it doesn’t look right at first.

• 

  jpiller3 · Member · Apr 3, 2014 at 3:03 pm

  • Copy link

  That worked perfectly! THANK YOU!!

• 

  designsimply · Member · Apr 3, 2014 at 10:02 pm

  • Copy link

  Yay! I’m so glad.

  Cheers :)