html - 如何将多个按钮与响应式设计内联？

Question

让我有几个按钮

  <button ng-repeat="a in graphdata" class="inline">

我需要将所有这些按钮排成一行，并且所有按钮都应该可见，并且在添加新按钮时应该调整其宽度。按钮应相互连接。

Answer 1

你可以使用flexbox

$('.new').click(function() {
  $('.element').append('<button class="inline">Button</button>');
});

.element {
  display: flex;
}
button {
  flex: 1;
  background: white;
  padding: 10px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="new">Add new Button</button>
<div class="element">
  <button class="inline">Button</button>
</div>