React

HTML

<div id="app"></div>

CSS

body {
  background: #20262E;
  padding: 20px;
  font-family: Helvetica;
}

#app {
}

React

class TodoApp extends React.Component {
  render() {
    return (
      <div>
         <div className="App">
      <Card title="Card 1">
        Lorem ipsum dolor sit amet, consectetur adipiscing elit.
      </Card>
      <Card title="Card 2">
        Donec dapibus porta sem, a tincidunt neque imperdiet non. Nunc ligula
        nibh, faucibus a ex nec, ullamcorper tristique libero. Vestibulum
        finibus, mauris tincidunt iaculis tristique, lacus ipsum egestas justo.
      </Card>
      <Card title="Card 3">
        Mauris ultrices tempus orci id suscipit. Integer feugiat commodo felis,
        ac euismod lacus faucibus sed.{" "}
      </Card>
    </div>
      </div>
    )
  }
}

const Card = ({ title, children }) => {
	const styleCard = {
  	background: 'white',
    padding: '30px',
    borderRadius: '10px',
    width: '130px',
    display: 'block',
    float: 'left',
    margin: '0 10px',
    color: '#555555'
  }
  
  const styleHeading = {
  	display: 'block',
    fontSize: '20px',
    marginBottom: '20px',
    color: '#000000'
  }

	return (
  	<div style={styleCard}>
  	  <strong style={styleHeading}>{title}</strong>
      {children}
  	</div>
  )
};

ReactDOM.render(<TodoApp />, document.querySelector("#app"))