Kamyar Parastesh Kamyar Parastesh - 9 months ago 33
CSS Question

Setting 2 dives with padding of 10 px

I have simple html page which works with 2 bootstrap and some handwrting css.
Here is the


.header {
width: 1024px;
height: 60px;
background-color: #ffffff;
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.09);
.gotoAndBot {
width: 109px;
height: 20px;
font-family: Roboto;
font-size: 15px;
font-weight: 500;
font-style: normal;
font-stretch: normal;
letter-spacing: 0.2px;
text-align: center;
color: #62e2c0;
#gal-bot-marvin-jpg {
width: 40.7px;
height: 41.7px;
.Oval-3 {
width: 42.9px;
height: 44px;
background-color: #ffffff;
border: solid 4px #62e2c0;

<div class="container">
<div class="header">
<div class="row" style="padding-left:10 px;">
<div class="col-sm-1">
<!--img id="Oval-3" src="../assets/robot.png"-->
<div class="Oval-3">
<div class="col-sm-1 gotoAndBot " style="padding-left:10 px;">

I need to put the
class with a 15 px
from the inner side div tag (
Also, there should be 10 px margin between 2 divs in the row (
and the
But it is not like it?

Answer Source
  1. You need to remove a space in style="padding-left:10px;" in block with classes gotoAndBot and row

  2. If you want to have some space within div.header, you can add padding: 15px; to this block. But keep in mind that you will also need to remove fixed height, otherwise, it won't work the way you want. For example, instead of using fixed height, you can use min-height: 60px;

  3. To have a space of 10px between 2 divs in the row (Oval-3 and the gotoAndBot ), you will need to rewrite some bootstrap classes. Because bootstrap classes like col-sm-1 etc have padding-right, padding-left and width set by default.