CODEWITHSUNDEEP
htmlcssangular-bootstrap
AmCurious
AmCurious

Reputation: 137

adding grid columns breaks the styling

I have three set of strings that i want to display in a single line. enter image description here

I want to add grid columns for all three such that even when window size is reduced each set remains intact. But adding grid columns is messign up with the alignment and spacing and it looks like this :

enter image description here

I removed padding and margin from both the col class but still it is of no help. Can anyone suggest what other css changes do i need to do to fix it. Please help!

.no-padding {
  padding: 0 !important;
  margin: 0 !important;
}
<div>
  <div class="col-sm-4 no-padding">
    <span>in the last 24 hours</span>
  </div>
  <div class="col-sm-7 no-padding">
     <span>trending down </span>
     <span> compared to 0 in previous 24 hours</span>
  </div>
</div>

Upvotes: 0

Views: 47

Answers (1)

scarsam
scarsam

Reputation: 346

Hard without code example but try this:

.text-right {
  text-align: right;
}

Add this to:

<span class="text-right">in the last 24 hours</span>

You add text-align right to the span class to align it next to the other div.

Upvotes: 1

Related Questions