My website is up and running. The only thing I haven’t been able to figure out is how to get my navigation buttons to be 3-D on my wordpress “guestbook page”
my site is kathykuczek.com
They look fine on all my pages but are flat on the guestbook page which is a wordpress document that has a customized template.
Any suggestions ?
Kuczek
Hm. I’m not entirely sure, but looking at the two, I think it’s because of the gallery page’s reset.
The gallery page has the WP css, which includes a CSS reset. One of the things in this reset is a whole bunch of elements listed getting
border: 0 none;
Now on your main (home) page, where you have style2.css, you do not have this reset. I think that because you did not list a border width, the browser is assuming you wanted one.
I only see border-style: solid and a border colour. I do not see a border width.
So I think on your page with the reset, because you have an earlier rule explicitly removing borders, the lack of a border-width is catching you here.
If you add in a width (it looks to be about 3 pixels?) on the gallery page, maybe your borders would show up.
Another reason resets used without some knowledge of what they are doing can be a bad thing (though if you had followed the rules on borders (that they really need all three things listed) you would not have seen it). Still, most of the things the reset removes borders from don’t even have borders anyway.
You may find a few things in the WP reset catching you in the future as well… so be careful.
I only remove them from images, who get an ugly blue border if you don’t : )
Let us know if this worked!
I see where the reset info is and the border:0 up at the top.
I tried adding border: 3px to my navigation buttons. It didn’t work.
Also tried adding it after the colors for the four sides. That didn’t work either …
#buttonA li a {
text-decoration: none;
height: 100%;
width: 100%;
display: block;
background-color: #70b3b8; /* was #999999 */
border-style: solid;
border: 3px;
border-bottom-color: #333333; 3px;
border-right-color: #555555; 3px;
border-left-color: #BBBBBB; 3px;
border-top-color: #DDDDDD; 3px;
}
You got me thinking with that reset … border: 0;
I took out border: 0; just to see what would happen and my navigation buttons are now in 3-D. It didn’t seem to change anything else so that’s good.
Problem solved - Thanks 
Ok, great.
As I said before, though, there is one element you DO prolly want to remove borders from: images.
so add this after your reset:
img {
border: 0;
}
Later, if you have an image you want borders on, you only have to be more specific (#container img or img.class or put an id on the image, whatever).
And for future reference, you still missed it a bit:
border-style: solid;
border: 3px;
border-bottom-color: #333333; 3px;
border-right-color: #555555; 3px;
border-left-color: #BBBBBB; 3px;
border-top-color: #DDDDDD; 3px;
should be
border: 3px solid;
border-color: #ddd #555 #333 #bbb;
A typical border shorthand statment:
border: 1px solid #f00;
which is the same as
border-width: 1px;
border-style: solid;
border-color: #f00;
http://www.w3.org/TR/CSS21/box.html#border-properties
While they do show examples only stating a border-style or just “border: solid;” those examples are assuming no other code around to interfere with borders, so for this reason I am always explicit (I mention all three properties).
Thanks for the additional info. This is my first attempt at all of this and there is definitely a lot to learn.
…Especially if you’re diving into WordPress. There’s a lot of stuff going on in their code. I have trouble reading it often. Don’t get discouraged if it seems hard; it is hard.
Good luck with your site.