同一级别的CSS按钮

Question

在你看到的这张照片中，我希望这些按钮与它们上面的文字处于同一级别。他们每个人都在不同的div中，但他们有相同的类名，因为我正在使用drupal。

非常感谢

Answer 1

将position: relative;用于红色背景元素。将以下属性分配给button。

{
   position:absolute;
   bottom:0;
   right:0;
}

Answer 2

查看使用flexbox。

我猜你会做这样的事情：

＆＃13;

＆＃13;

.container {
  display:flex;
  flex-flow: row nowrap;
}

.column {
  margin: 0 1em;
  display: flex;
  flex-flow: column nowrap;
  justify-content: space-between;
  align-items: flex-end;
  flex: 1 1 0;

}

＆＃13;

<div class = "container"> 
<div class = "column"> <p>foo foo foo</p><button> button</button></div> 
<div class = "column"> <p>foo foo bar

foo foo barfoo barfoo barfoo barfoo
foo foo barfoo barfoo barfoo barfoo
foo foo barfoo barfoo barfoo barfoo
foo foo barfoo barfoo barfoo barfoo
foo foo barfoo barfoo barfoo barfoo

foo barfoo barfoo barfoo bar</p><button> button</button></div> 
  <div class = "column"> <p>foo RAHA RAHAHAR</p><button> button</button></div> 
</div>

＆＃13;

＆＃13;

＆＃13;