Disappearing lines when customising colour

• 

  theshooglychair · Member · May 31, 2014 at 7:19 pm

  • Copy link
  • Add topic to favorites

  Hi, I am using the Truly Minimal theme on my blog. I’ve just tried to customise the colours on my links and headers on my blog after purchasing the custom upgrade. However, I notice that I if I change the default colours, I lose the dotted lines dividing the different sections on the page; the line between the header and the body, between the body and the sidebar.

  Is there any way that I can change the colours to suit my header and still keep those dividing lines? If not, is there another way of introducing those dividing lines using CSS ?

  Thanks in advance, any help would be appreciated.

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

• 

  cousett · Member · May 31, 2014 at 7:37 pm

  • Copy link

  Add some CSS to your theme to recreate the dotted or dashed lines

  it could be something like the following for the header:

  .site-header {
  border-bottom: purple dotted;
  }

  Also here is a link that might help out: W3Schools CSS Border

• 

  theshooglychair · Member · May 31, 2014 at 8:06 pm

  • Copy link

  Super! Thanks for the prompt reply Cousett. Am working with the code you’ve given and the tutorial page. Fiddling around with it as we speak, though I might need a hand again!

• 

  theshooglychair · Member · May 31, 2014 at 8:11 pm

  • Copy link

  I knew I’d get stuck! Is there any way to increase or decrease the spacing..which I think is called Padding? I would like to decrease the space between the menu and the dotted line. Any ideas?

• 

  cousett · Member · May 31, 2014 at 8:18 pm

  • Copy link

  Happy to help. I tried going back to your site but it is set up as private I requested access just to see what needs to be changed. Let me know if this works for you.

• 

  theshooglychair · Member · May 31, 2014 at 8:19 pm

  • Copy link

  Oops, I’ve changed it back to public…

• 

  theshooglychair · Member · May 31, 2014 at 8:22 pm

  • Copy link

  Also, can I get a dividing vertical line, by the side of the sidebar? Between the main body and the sidebar? Trying to figure that out, but it’s eluding me.

• 

  cousett · Member · May 31, 2014 at 8:34 pm

  • Copy link

  Here is the code to change the margin actually in this theme for between the menu and the line

  .navigation-main {
  margin: 0.5em 0;
  }

  You can change it to .5 em but you could reduce it even further if needed.

  For the sidebar you could add something like the following:

  .site-content {
  border-right: purple dotted;
  }

  I would also possibly add some padding to the right so the dotted line isn’t so close to the text.

  padding-right: 20px;

• 

  theshooglychair · Member · May 31, 2014 at 8:50 pm

  • Copy link

  Grand! Thanks Cousett, much appreciated :)