CODEWITHSUNDEEP
htmlcss
AticusFinch
AticusFinch

Reputation: 2431

Placing a div inside a table cell

I'm trying to get a DIV element into a table cell, in a way in which the <div> spreads along all the cell's area. But, for unknown reason, a 1px border appears; as far as I know, it's neither part of the table or the div (table has no borders, padding or spacing, and the div has no margin or padding). Perhaps you can spot me the bug?

<html>
  <head>
    <style type="text/css">
      #arrow {
        border-style: solid;
        margin: 0;
        padding: 0;
        border-width: 100px 0px 100px 50px;
        border-color: blue blue blue red;
      }

      table {
        border-collapse: collapse;
        border-style: none;
        padding: 0px;
        spacing: 0px;
      }
    </style>
  </head>

  <body>
    <table>
      <tr>
        <td bgcolor="red">
          Blah,
        </td>
    <td>
      <div id="arrow"><!----></div>
    </td>
        <td bgcolor="blue">
          blah.
        </td>
      </tr>
    </table>

Upvotes: 0

Views: 14160

Answers (3)

Jared
Jared

Reputation: 721

Add styling for the table cell(s):

 <html>
  <head>
    <style type="text/css">
      #arrow {
        border-style: solid;
        margin: 0;
        padding: 0;
        border-width: 100px 0px 100px 50px;
        border-color: blue blue blue red;
      }

      table {
        border-collapse: collapse;
        border-style: none;
        padding: 0px;}

        td  { padding:0; border:0;}

    </style>
  </head>

  <body>
    <table>
      <tr>
        <td bgcolor="red">
          Blah,
        </td>
    <td>
      <div id="arrow"><!----></div>
    </td>
        <td bgcolor="blue">
          blah.
        </td>
      </tr>
    </table>
</body>
</html>

Upvotes: 1

Av Pinzur
Av Pinzur

Reputation: 2228

<table cellspacing="0" cellpadding="0" border="0">

-- or --

td { padding:0 }

Upvotes: 1

BC.
BC.

Reputation: 24978

CSS property is "border-spacing" instead of "spacing"

In addition I reset tables using

outline: 0;

Upvotes: 2

Related Questions