Counters Component not rendering peoperly like shown in the tutorial

React
1

I am trying to code along with the video. I did the same shown in the React tutorial where the Counters component is introduced (“Composing Components”). The output which I am getting is not looking same as the output shown in this video. I am attaching the code here. Please help me with this. I am not able to understand what’s wrong with my code.

Screenshot_1

As seen in the above image, there is no gap between the each counter component like shown in the tutorial. My code:
Counter.jsx:

import React, { Component } from "react";
class Counter extends Component {
  state = { value: this.props.value };
  styles = {
fontSize: 10,
fontWeight: "bold",
  };

  // constructor() {
  //   super();
  //   this.handleIncrement = this.handleIncrement.bind(this);
  // }

  handleIncrement = () => {
this.setState({ value: this.state.value + 1 });
  };

  render() {
return (
  <div>
    <span style={this.styles} className={this.getBadgeClasses()}>
      {this.formatCount()}
    </span>
    <button
      onClick={this.handleIncrement}
      className="btn btn-secondary btn-sm"
    >
      Increment
    </button>
  </div>
);
  }

  getBadgeClasses() {
let classes = "badge m-2 badge-";
classes += this.state.value === 0 ? "warning" : "primary";
return classes;
  }

  formatCount() {
return this.state.value > 0 ? this.state.value : "Zero";
  }
}

export default Counter;

Counters.jsx:

import React, { Component } from "react";

import Counter from "./counter";

class Counters extends Component {

  state = {

    counters: [

      { id: 1, value: 4 },

      { id: 2, value: 0 },

      { id: 3, value: 0 },

      { id: 4, value: 0 },

    ],

  };

  render() {

    return (

      <div>

        {this.state.counters.map((counter) => (

          <Counter key={counter.id} value={counter.value} selected={true} />

        ))}

      </div>

    );

  }

}

export default Counters;

Please help me to understand where I am going wrong and what can be done to fix this.