ListGroupItem и Button от реакции-начальной загрузки в одной строке - PullRequest
0 голосов
/ 16 декабря 2018

Я делаю свой первый реактивный проект.Я новичок в программировании на JS, HTML, CSS и даже в веб-приложениях.

То, что я пытаюсь сделать, - это отображать кнопки в одной строке (с некоторым запасом) с моими ListGroupItem.

* 1005.* Мой код ниже (Project.js):
import React, { Component } from "react";
import { ListGroupItem, Button, ButtonToolbar } from "react-bootstrap";

class Project extends Component {
  render() {
    return (
      <ButtonToolbar>
        <ListGroupItem href="#link1">{this.props.project.name}</ListGroupItem>
        <Button bsStyle="primary">Primary</Button>
      </ButtonToolbar>
    );
  }
}

export default Project;

И изображение, которое я хочу сделать:

enter image description here

Спасибо за любые советы!Если у вас есть дополнительные вопросы, пожалуйста, напишите в комментариях ниже

РЕДАКТИРОВАТЬ:

Я добавил

.btn-toolbar {
  display: flex;
}

к моему App.css, сейчасэто выглядит так:

enter image description here

Я в порядке, мне это нравится.но теперь, как сделать размер этой белой полосы статичным?

1 Ответ

0 голосов
/ 16 декабря 2018

используйте display flex, попробуйте добавить это на панели инструментов css .btn {display: flex;}

...