How to add margin to div

Question

<div style="width: 500px;height:60px;margin: auto;">
       <div style="width: 300px;height:60px;background: red;float:left;"></div>
       <div style="width: 200px;height:60px;background: blue;float:right;">Some great text here</div>

</div>

How can I add a 20 pixel margin by CSS code in text? I tried

   padding-left: 20px;

but this will make the second block go down .

P.S. The span tag is not an option, and I don't want to create another class for only the text.

You could add `white-space: no-wrap` to keep the container on one line — Philippe, Nov 13 '19 at 17:01

score 1 · Accepted Answer · answered Nov 13 '19 at 17:00

1

Add box-sizing: border-box; to both elements or the the parent element, you can even add it to your body.

box-sizing defines how the size of your elements is calculated. border-box means, that the sum of content width, border-width and margin-/padding-width equals the defined width. Using content-box instead means that width only defines the content width.

answered Nov 13 '19 at 17:00

L. Männer

446
2
15

1

thank u very much p.swill confirm as an answer in 10 mins – flemeth wow Nov 13 '19 at 17:02

How to add margin to div

1 Answers1