CSS- help need pointing me to where to change things

[ramoth]

Arrg I am clearly a numpty  so please forgive if this question has been asked and answered a million times before 

This is the site I am building : http://www.teckelsanimalsanctuaries.com/

Obviously next to no content at the moment as I want to get the styling right before I add the rest of it.

First problem:

I have cheated with the logo simply uploading our logo and renaming it to replace the cms default logo - however I'm stuck now I want to have a centered banner with the site name and our slogan running pretty much across the whole of the header - can someone direct me to which style sheet I need to change to do that? (I'm using the left simple +1 column template) and then where in that stylesheet do I make the changes specifically to center the banner. I thought I had it figured out and tried changing the logo we have up but it wants to stay left - adding the instruction float center doesn't do anything; adding float right made it dissapear completely. 

Second problem:

I really do not like the yellowy mustard colour of the highlight in the menu column I want it to be the same light blue as our banner (well actually I may not like that when I see it but knowing where I change that colour value will make it a heck of a lot easier for me to play around until I find a colour I like) - I have changed loads of colours in both the main style sheet and then trying to change values in the navigation simple verticle sheet but that changes nothing - and could even be entirely the wrong stylesheet to edit anyway  could some kind soul point me to the correct stylesheet and then to the part of the code which defines the colour to be used?

Many thanks. 

[lollipop27]

did you add these stylesheets to your template? looks a lot like you didn't.


center the header, it is wraped in a h1, check to fint the #header h1 and say text-align: center;

as for the navigation, there is one statement


/* hover state for all links */
div#menu_vert a:hover {
  background-color: #C3D4DF;
}

change it there....

[lollipop27]

sorry, don't know if you know how to link a styleshee´t... you go to your templateoverview and click right on the yellow css button.... there you can choose the stylesheets being added.

[ramoth]

Thank you I have now managed to change the hover colour! (You have no idea how pleased I am about that LOL)

[ramoth]

Ok I have figured out where to find the relevant stylesheet and I now have the bigger banner up and displaying but I still cannot get it to center.

Code: Select all

/*** header ***
we will hide text and replace it with a image
we need to assign a height for it so that the image wont cut off
*/
div#header {
   height: 110px;    /* adjust according your image size */
   background: #385C72;            
}

div#header h1 a {
/* you can set your own image here */
   
   background: #385C72 url(images/cms/logo1.gif) no-repeat 0 12px; 
   display: block;
   height: 120px;             /* adjust according your image size */
   text-decoration:none; /* old firefox would have shown underline for the link, this explicitly hides it */
   text-indent: -999em;  /* this hides the text */
}

/* position for the search box */
div#search {
   float: middle;
   width: 23em;    /* enough width for the search input box */
   text-align: right;
   padding: 0.6em 0 0.2em 0;
   margin: 0 1em;
}

I have tried removing the text-indent altogether and the banner dissapears - I have tried removing text-indent and adding text-align: right; - still no banner I've tried float middle and center - nothing happens.

Pretty sure it's something very basic that I'm missing - any help gratefully appreciated!

[RonnyK]

What about changing the last parameter to "center",

  background: url(uploads/images/background.jpg) no-repeat center;

Btw, the default place to store non-CMSMS stuff is under uploads. That's why the url shown above starts there.

Ronny

[Dr.CSS]

I usually put all images for the Template in a folder in uploads else when a user looks for images to add to pages they see all the template images also...