CODEWITHSUNDEEP
css
user889030
user889030

Reputation: 4754

CSS : how to add extra length to background color

i have added background color to text but i want to add a bit more black color on start and it end of string so that its readable better. But

sample code

<div class="row" style="background-color: black; color: white; display: inline; font-weight: bold;">   12345678890   </div>

so this looks like

enter image description here

however i want to add extra color it start and end like this

enter image description here

so any idea how to do it , i tried with adding blank spaces to string but it not working

Upvotes: 0

Views: 116

Answers (5)

TechieViking
TechieViking

Reputation: 136

Here is the solution: Please have a look into it. https://web-platform-tjjnkh.stackblitz.io

Note: If you're using a bootstrap then you can use a class like px-value and py-value where value is from 1-5.

Upvotes: 0

54ka
54ka

Reputation: 3589

  1. You can use padding

    <div class="row" style="padding:0 5px; background-color: black; color: white; display: inline; font-weight: bold;"> 12345678890
    </div>

  1. You can use &nbsp;

    <div class="row" style="background-color: black; color: white; display: inline; font-weight: bold;">&nbsp; 12345678890 &nbsp;
    </div>

Upvotes: 2

Agnes Liszka
Agnes Liszka

Reputation: 69

Use padding-left and padding-right. e.g.

padding-left: 20px;
padding-right: 20px;

https://www.w3schools.com/cssref/pr_padding-left.asp

Upvotes: 0

Mudit Agrawal
Mudit Agrawal

Reputation: 355

Adding left and right padding to the div could help you in this. Try this :-

<div class="row" style="padding-left: 10px; padding-right:10px; background-color: black; color: white; display: inline; font-weight: bold;">   12345678890   </div>

Upvotes: 0

Nghi Nguyen
Nghi Nguyen

Reputation: 950

<div class="row" style="padding:0 10px; background-color: black; color: white; display: inline; font-weight: bold;">   12345678890   </div>

Just add a little padding. It work for your case

Upvotes: 0

Related Questions