Problem with simple code

• 

  perthtastebuds · Member · Aug 5, 2009 at 1:17 pm

  • Copy link
  • Add topic to favorites

  Hi, need help navigating CSS for my new blog [http://perthtastebuds.wordpress.com]

  Problem: I want to change the green border along the top of the banner image at the top.

  When I change the colour in this code below, I get the colour change at the top but ALSO down the sides and along the bottom! How can I just change that green bar???

  Code:
  #header {
  background:#fff url(img/better-header.gif) no-repeat bottom;
  height: 183px;
  margin: 0 auto;
  width:760px;
  padding:0;
  border:#fc9 0px solid;
  }

  Any help most appreciated.

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

• 

  devblog · Member · Aug 5, 2009 at 2:14 pm

  • Copy link

  border:#fc9 0px solid;

  I’m assuming you set the border to 0 pixels to “disable” it temporarily?

  If you want to change only the top border to, let’s say, red, and leave the other sides green, you should modify your definition to this:

  border-bottom: #fc9 1px solid;
  border-left: #fc9 1px solid;
  border-right: #fc9 1px solid;
  border-top: #f00 1px solid;

  if you only want to have a red border, then you’d need to just use the last attribute:

  border-top: #f00 1px solid;

  Of course, red is a sample color; you’d need to change the HEX value to the actual color you wanna use.