Glen Morse
Glen Morse

Reputation: 2593

css/html Table border

I would like to options for making tables in my css. One with a border of 5px solid black and one with 0px. Currently in CSS i have

#contentcolumn table {
border: 5px solid black;
width: 100%;/*around 700 max for images*/
border-collapse: collapse;
}

That gives me the black 5px border, but now i need to also have one that does 0px border. I have tried setting the 0px table in html but the css seems to over ride it. here is the html for the two tables.

<table>
        <tr>
            <td align="center"><IMG SRC="images/newsimage/minecraft1.jpg" ALT="mindcraft">
            </td>
        </tr>
        <tr>
            <td>Is minecraft still considered an indie game? blah blah blha lbhalbhal
            </td>
        </tr>
        </table>


        <!-- Reviews start -->
        <!-- Review #1 -->
        <table Border='0'>
        <tr>
          <th rowspan="4" width="30%">Some Image</th>
          <td>Link</td>
        </tr>
        <tr>
          <td>By who</td>
        </tr>
        <tr>
          <td>Some info</td>
        </tr>
        <tr>
          <td>comments</td>
        </tr>
        </table>

both tables are inside div tags <div id="contentcolumn"> if that matters?

Upvotes: 0

Views: 478

Answers (3)

Krish
Krish

Reputation: 2660

You can done this using css itself. By using below css style

#contentcolumn #review_table{border:0px}

and add a id in your table like below

<div id="contentcolumn">
<table>
    <tr>
        <td align="center"><IMG SRC="images/newsimage/minecraft1.jpg" ALT="mindcraft">
        </td>
    </tr>
    <tr>
        <td>Is minecraft still considered an indie game? blah blah blha lbhalbhal
        </td>
    </tr>
    </table>


    <!-- Reviews start -->
    <!-- Review #1 -->
    <table Border='0' id="review_table"> //CHANGE: ADD THE ID TO THIS TABLE
    <tr>
      <th rowspan="4" width="30%">Some Image</th>
      <td>Link</td>
    </tr>
    <tr>
      <td>By who</td>
    </tr>
    <tr>
      <td>Some info</td>
    </tr>
    <tr>
      <td>comments</td>
    </tr>
</table>
</div>

JSFILLDE:

http://jsfiddle.net/54EyB/

Upvotes: 0

Mihai Matei
Mihai Matei

Reputation: 24276

CSS:

.no-border {
   border:none;
}

HTML:

<table class="no-border"></table>

Upvotes: 1

Mihai Matei
Mihai Matei

Reputation: 24276

Try to give border:none into style attribute. It will overwrite your css properties in css file. <table style="border:none;">

Upvotes: 2

Related Questions