Basic CSS question

I'm trying to customize a website template I purchased. It's got a lot of CSS already set and some of it I don't like. Unfortunately, it's hard to track down where some of the things are set. So, I want to be able to override what's in the .css files.

I want to create a style for a table. What I'm trying is not working.

In my file, I have...

      <style type="text/css">
                        table.stevetable {padding:30px; vertical-align:middle; border:thin;}
                        <table border="1" cellpadding="6" cellspacing="0" width="100%" bordercolor="#000000" class="stevetable">

... but it's not working. What am I doing wrong? Thanks.
Who is Participating?
LZ1Connect With a Mentor Commented:
You should start by removing the table attributes like bordercolor, border and width. Those can all be specified in CSS. You can leave the cellpadding and spacing if you want, but you can always set those in CSS too. Up to you really.

As far as the CSS not hitting the table, can you show a live link?
You should also be more specific in your CSS.  Don't just apply style to the entire table. Try hitting the tr and td to see if you get anything.
Yeah, we need the link. Template almost always make modification outside the limits that the author envisioned almost impossible.  A lot of them screw up the cascade with jquery and are almost impossible to work with unless you go into the scripting.

skbohlerAuthor Commented:

Thanks for your replies. It's true that the effects I wanted were not there because I needed to apply them to the "td" and not whole table. Now I just need to figure the attribute to get a border around it.
A border around the table? or cell?

table{border:1px solid #000000;}/*black*/

td{border:1px solid #3366ff;}/*blue*/

Open in new window

skbohlerAuthor Commented:

I tried this and it seemed to work too:

            <style type="text/css">
                        table.stevetable td {padding:10px; vertical-align:middle; border-width:medium; border-style:solid; }
                        table.stevetable {border-color:#000000; border-width: 7px; border-style: solid; }
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.