LaVOZs

The World’s Largest Online Community for Developers

'; bootstrap 4 - Why isn't my CSS working when I try to target a div tag with the class "row" and an id? - LavOzs.Com

I'm new to bootstrap 4 and am using the class "row" in multiple places. I want to add a margin-left to just one of these div tags with the class row, so I added an id to the div tag.

<div id="menumargin" class="row">

when I use this CSS

.row{
margin-left: -15px !important;
}

it works but affects all instances of row obviously. However this CSS I write to just target this instance:

#menumargin.row{
margin-left: -15px !important;
}

doesn't work. It's as if the code isn't written at all.

Please advise.

I hope this question makes sense. I'm also new to Stack Overflow.

Columns have horizontal padding to create the gutters between individual columns, however, you can remove the margin from rows and padding from columns with .no-gutters on the .row. The gutters between columns in our predefined grid classes can be removed with .no-gutters. This removes the negative margins from .row and the horizontal padding from all immediate children columns.

<div class="container">
  <div class="row no-gutters">
    <div class="col">col</div>
    <div class="col">col</div>
    <div class="col">col</div>
    <div class="col">col</div>
  </div>
  <div class="row">
    <div class="col-8">col-8</div>
    <div class="col-4">col-4</div>
  </div>
</div>