Tutorials, Tips, and Resources

for Creating a Better Blog



7-Day Blog Bootcamp Challenge


Shape up your blog in a week! (learn more)



Blogger How To: Remove Borders From Pages Menu

How To Remove Borders from a Blogger Pages Menu

 

I just finished showing you how to center your Blogger Pages menu using a simple code, and now I wanted to take it a little further by showing you how to customize it even more. By default, a standard Blogger template with the Pages widget active displays it in a boxy format with a 1px border around the entire thing, and separator lines between each link. This look might not match your overall layout and look a bit out of place, so let’s get rid of those darn lines!

Start by heading over to the Template page in Blogger then clicking Customize. In the top left menu choose Advanced.

In the second menu choose Add CSS and add the following code:

While we’re at it, let’s remove the grey background from the first link in the menu. Add this below the code you just added:

That’s all there is to it! Save your changes and stop stressing over those dumb borders ;). You might also want to learn how to add category links to your menu bar!


  • Thanks Dana so helpful! Also would love your opinion on my blog…

  • Thanks alot. It was super helpful for my new Blog. And super easy even if a have no clue about HTML an CSS and codes… ;p Hey, i am leaarning! hehe
    http://learnfrompassion.blogspot.ch/

  • Monica

    This is so helpful! Thank you so much!

  • Thank you so much!

  • Once again EASY PEASY thank you! <3

  • Rachel Trindade

    how can i change de color of the menu? it`s not easy? i love you tips buy de way! thank you! <3

  • THANK YOU! I have been working on tweaking things on my blog all night and was trying to get a thin line to appear above and below the menu bar. OMG I used this and just added in the border I wanted and it WORKED!!! Thank you so much!

    Here’s my blog, I’ve used so many of your tips to get it JUST how I want it!

    http://gypsyheartdreams.blogspot.com/

    • Laureane Clark

      Natasha, how did you get the thin lines? I can’t get mine to work. 🙁

  • praveen kaushik

    Hi..this article was gr8 but i wnt to add borders to ol d gadgets in my blog..wht css code shud i write??
    my blog-> successinfinite.blogspot.com
    rply me ASAP!!!
    THANK YOU 🙂

  • Anna Costa

    Thank you so much! CSS sounds super simple, its a pity I just-cant-do-it !

  • www.jazzozin.blogspot.com

    This is insane!!

  • Iam writting to say Thank you! Greetings from Greece! Keep up your wonderful job, you are helping us a lot!
    Hugs!

  • Thank you so much! I’ve been meaning to sort out my pages menu for so long, you’re a huge help 🙂

    http://dreamsandcolourschemes.blogspot.co.uk

  • Thank you so much! I was not happy at all with the way my navigation bar looked with the border. I will be coming back for more tips as I continue to work my blog until it’s exactly how I want it!

    theswinlife.blogspot.com

  • Nothing changes when I add anything to CSS, is this because I have already added other codes to CSS for other things?
    CSS just never works for me ever since I added a drop down menu with CSS.

    Can anyone help me with this? cmalia.blogspot.co.uk

  • Anastasia Vorton

    Oh, GOD!
    Thank’s a lot)!!!
    It’s the first successfull thing that i’ve done using your tips)).
    I sure that there’s something wrong with me so i can’t do lots of things that you post here).
    But I really like your blog – it’s my favorite now, so many halpful things).
    Thank you for your blog!

  • Jazzi Nails

    hi Dana this looks really good but when I tried it, it didn’t work is it because I have got other codes in there? Please reply I have used some of your other tips and they have really helped so i just want to get this sorted, thank you!! my blog so far! = http://www.jazzinails.co.uk xx

  • Hi Dana Just want you know that the link under “how to center your Blogger Pages menu” is not working 🙂

  • Andrea Nicole

    AHHHH WHY didn’t I find your blog sooner. THANK YOU!!!!!

  • Vanilla Papers

    What a life saver 🙂 That uncentered page menu was really bothering me, and now I did that plus a few other things.

  • Holly

    THANK YOU!!!!!

  • Lisa

    THANK YOU SO MUCH! I’ve spent 5 nights in a row now to find out how to work with that and now it just took me 2 minutes. Thanks!

    http://englandondetours.blogspot.co.uk/

    • yay! glad you found it helpful!

  • I am using the dynamic view template and the code doesn’t work for me. I wanted to

    remove the grey boxes from my tabs. any suggestions?

    my site below

    http://www.sequenceunlimited.com/

  • Hi Dana! I have my Pages widget in my sidebar, which makes the pages line up in a list format. I want to get a box around each page name (Home, About, FAQ, etc.); how would I go about doing that? Thanks! x

  • Hommie Magnus Kairos

    it works!!! Thank you so much!!!

  • wowbelwow x

    Hi, can you only have on css in at a time or something because I can’t seem to get this to work? Thanks x

  • You are a genius. Yet again I am so grateful to you!

    <3 LR

  • Maeve Sutcliffe

    this didn’t work for me 🙁

  • great job you’re doing here.

  • this doesn’t work for me… 🙁

    http://moibyines.blogspot.com.es

  • how can I do this to a drop down menu??

  • Vienna Li

    thanks!

Navigate