Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS span with border

Tags:

html

css

Hi i don't get why my span with border looks like this

enter image description here

this is the css behind

color:red; 
font-size: 12px;
background-color: #ffcaca;
background-image:url(/Content/x.png);
background-size: 20px 20px;
background-repeat:no-repeat;
background-position:2px;
padding: 5px;
border-radius: 5px 5px 5px;
border: 1px solid red;
padding-left: 25px;
position:relative;

and html

<tr>
    <td>
        <span>[...]</span>
    <td>
<tr>
like image 820
theLaw Avatar asked Mar 06 '14 16:03

theLaw


People also ask

How do you put a border in a span in css?

block elements are a rectangle (thus block), and can have a border and float properties. inline do not have a border. you can turn a span into a block element via css, its clearer to use a div. as an asp:panel renders as a div, so it supports a border, just assign it a css class with a border property.

Can spans have borders?

you can also use border style for this. apply border style and then get the border styling on the span element.

Can css be applied to span?

You can use the HTML span tag as a container to group inline elements together so you can style or manipulate them with JavaScript.


1 Answers

You can give display: block to the span element or use div element instead of using span element.

I would prefer the latter one.

like image 136
Mr_Green Avatar answered Oct 06 '22 23:10

Mr_Green