CODEWITHSUNDEEP
css
asafg8
asafg8

Reputation: 69

Why is the border not shown?

CSS:

.num{
       z-index:8;
       background-color:#ffd200 ;
       width: 180px;
       height: 47px;
       color: #ffd200;
       border:#ffd200 double 6px; 
       border-radius: 20px;
}

HTML:

<div id="ll">
    <table id="num">
        <tr >
            <td class="num"></td>
            <td class="num"> </td>
        </tr>
    </table>

Given that setup, why is the border not visible?

Upvotes: 0

Views: 225

Answers (2)

Anthony Grist
Anthony Grist

Reputation: 38345

If you're asking why you can't see the border, it's because you've set the colour of the border (and the colour of the text, for that matter) to be the same as the back-ground colour of the element, so it just blends in.

Here is a jsFiddle to illustrate it - changing the colour of the border makes it appear.

Modifying the CSS to something such as this:

.num {
    background-color:#ffd200 ;
    color: #ffd200;
    border: #ffffff double 6px;
}

would cause the border to appear. This will create an element with the orange background and a white border, rather than an orange background with the same orange border.

Upvotes: 4

Bon Espresso
Bon Espresso

Reputation: 693

You can see the border if the border-color differs to background-color!

Upvotes: 1

Related Questions