Kubrick border color change

• 

  sarahemichael · Member · Mar 2, 2008 at 2:54 am

  • Copy link
  • Add topic to favorites

  I have learned a lot today but am still just beginning… I would like to figure out how to change the border color of Kubrick to white. I found the CSS code to remove the header and footer boarders (which were images, actually) but the middle section (body / content?) I am stumped on. I think I isolated it in the .alt code under content but changing those colors did not do the trick:

  .alt {
  background-color: #f8f8f8;
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  }

  I saw that Kubrick is old and clunky a bit too late and I may try Kubrick for Sandbox another day.

• 

  sarahemichael · Member · Mar 2, 2008 at 2:55 am

  • Copy link

  I meant to leave my url: http://creativeact.wordpress.com/

• 

  rosclarke · Member · Mar 2, 2008 at 5:27 am

  • Copy link

  It looks like the main border is an image too. Try under the ‘body’ section of coding.

• 

  sarahemichael · Member · Mar 2, 2008 at 5:41 am

  • Copy link

  Thanks – one of the first things I did was remove the image in the body there but I already deleted it to make the space around the main area white. I think you are right that it’s the body section – it is like it is still calling the image even though it’s been deleted.

• 

  isadora · Member · Mar 2, 2008 at 9:44 am

  • Copy link

  Use this:

  #page {
          background: white url('http://creativeact.files.wordpress.com/2008/03/background.jpg');
  }

• 

  sarahemichael · Member · Mar 2, 2008 at 1:58 pm

  • Copy link

  That’s Isadora! I worked like charm, I’m learning – so I see that instead of calling URL http://creativeact.wordpress.com/files/2008/03/background.jpg (I chose the URL because it best matched Kubrick’s image file) I should have called http://creativeact.files.wordpress.com/2008/03/background.jpg’. Can I assume for any similar needs I can put the files in the url e.g. .files. rather than as a folder /files/? I appreciate the help.

• 

  isadora · Member · Mar 2, 2008 at 2:02 pm

  • Copy link

  I think both urls work, you’ll find the right one under manage > uploads by clicking on the image you want to use. The problem was that you used the wrong selector (body instead of page).

• 

  sarahemichael · Member · Mar 4, 2008 at 3:17 pm

  • Copy link

  So I am back – Isadora helped me resolve the border image issue on my /home/ page the other day but this morning when I clicked on a specific post, e.g. not the main page of all post, I noticed that the grey border image is on this page: http://creative-act.com/2008/03/04/must-create/

  I poked around a bit trying to figure out where the code is for the sub-pages but could not find it. I have replaced all the kubrick images in the code so I wonder if there is a routine that is calling the image file code that since I do not know CSS very well, I am not recognizing as a routine.

  Which brings me to another question: it appears that the “# page, body, header, etc.” indicates the specific aspect of the style sheet the code below it is addressing but I’ve noticed several lines of code that only being just “.widecolumn” – what does the period indicate, if anything?

• 

  rosclarke · Member · Mar 4, 2008 at 4:01 pm

  • Copy link

  One is a class and one is an id (and I can never remember is which). A class indicator refers to a number of different places that all draw on the same code; an id is used for a unique feature. Try looking in the tutorials listed in the sticky.

• 

  isadora · Member · Mar 4, 2008 at 5:42 pm

  • Copy link

  yes, you have to modify also .widecolumn and .narrowcolumn
  The period indicates a class (class selector), the # uses the id of an element (id selector),
  body, p, h1, a are html elements (type selector)
  Here some theory about it: http://www.w3.org/TR/REC-CSS2/selector.html

• 

  sarahemichael · Member · Mar 4, 2008 at 5:58 pm

  • Copy link

  Thanks to you both. I am working on it today. Will let you know how it goes.