javascript - 如何在 REACT 中编辑 Bootstrap 按钮 `pull-right`？它没有响应(使用 bootstrap v3)

Question

我想在我的文章列表上添加按钮。这是为了保存文章。但它不会向右移动。我试过了，它起作用了，但按钮相互重叠。所以我的方法是将它包裹在一个 div 容器周围并给那个 div 一个 className=pull-right 。我是新手 - 没有工作。我希望有人能阐明这一点 - 提前致谢。

import React from "react";
import styles from "../styles/style.css";
const Results = props => {
  return (
    <div className="container fluid">
      {/* line space */}
      <div>Search Results: </div>

      <ul className="list-group">
        {props.results.map(result => {
          return (
            <a href={result.url} onClick={result.handleArticleOnClick}>
              <li className="list-group-item" key={result.id}>
                {result.title}
                <button
                  type="button"
                  className={styles.style}
                  onClick={result.handleSaveArticle}
                >
                  Save this
                </button>
              </li>
            </a>
          );
        })}
      </ul>
    </div>
  );
};

export default Results;

Answer 1

只需清除 float 即可。

    <li className="list-group-item clearfix" key={result.id}>
        ...
            <button
              type="button"
              className={`pull-right ${styles.style}`}
              onClick={result.handleSaveArticle}
            >