выровнять несколько липких элементов вдоль родительского контейнера

Передача конкретной реализации функции DataSource - источник данных, собранный в tomcat, обеспечивает доступ к username, url и т. д. (подробности см. в DataSource ):

if (dataSource instanceof org.apache.tomcat.jdbc.pool.DataSource) {
    org.apache.tomcat.jdbc.pool.DataSource tcDataSource = (org.apache.tomcat.jdbc.pool.DataSource)dataSource;
    logger.info(tcDataSource.getUrl());
    logger.info(tcDataSource.getUsername());
    ...
}

2
задан MHComputech 16 January 2019 в 10:53
поделиться

2 ответа

Я отредактировал ваш код, и вот то, что вы ожидали, пожалуйста, посмотрите, что я использовал стиль position, чтобы выровнять его по правому краю, поместив два button в один div <div class="pushRight"> и добавив стили для этого div ]

body {
  margin: 0;
  background-color: #222222;
}

.todoContainer {
  display: flex;
  align-items: center;
  outline: none;
  border: 0;
  border-radius: 0;
  border-bottom: 1px dotted #666666;
  padding-bottom: 5px;
  margin-bottom: 15px;
  position: relative;
}

.todoContent {
  font-size: 25px;
  color: #ffffff;
}

.btnTodoAction {
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  outline: none;
  width: 40px;
  height: 40px;
  padding: 8px;
  border-radius: 40px;
  border: 0;
  background: #2a2a2a;
  color: #555555;
}
.pushRight{
  position: absolute;
  right:0
}

.todoIsCompleted>.todoContent {
  position: relative;
  color: #666666;
}

.todoIsCompleted>.todoContent::before {
  position: absolute;
  content: "";
  left: 0;
  top: 50%;
  right: 0;
  border-top: 2px solid #85bf6b;
}

.todoIsCompleted>.btnToggleTodoState {
  color: #85bf6b;
}
<div class="todoContainer">
  <button class="btnTodoAction btnToggleTodoState">T</button>
  <span class="todoContent">Item 1</span>
  <div class="pushRight">
  <button class="btnTodoAction">E</button>
  <button class="btnTodoAction">D</button>
  </div>
</div>

<div class="todoContainer todoIsCompleted">
  <button class="btnTodoAction btnToggleTodoState">T</button>
  <span class="todoContent">Item 2</span>
   <div class="pushRight">
  <button class="btnTodoAction">E</button>
  <button class="btnTodoAction">D</button>
  </div>
</div>

0
ответ дан Sethuraman 16 January 2019 в 10:53
поделиться

Мы можем достичь этого, используя float, проверим пример кода .

Здесь добавлено floating вместо display:flex

Для правого выравнивания добавлен класс

.pull-right{ float:right; }, и он будет вызываться в

<button class="btnTodoAction pull-right">D</button>
<button class="btnTodoAction pull-right">E</button>
0
ответ дан Balaji731 16 January 2019 в 10:53
поделиться