无法将div居中对齐到底部

时间:2019-09-26 16:32:09

标签: html css

我的居中div与底部对齐存在问题,如何解决?已经尝试了SO的一些技巧,但完全没有帮助。

HTML

mat-radio-ripple-element

CSS

.mat-radio-container {
    height: 15px !important;
    width: 15px !important;
}

.mat-radio-outer-circle {
    height: 15px !important;
    width: 15px !important;
}

.mat-radio-inner-circle {
    height: 15px !important;
    width: 15px !important;
}

.mat-radio-button .mat-radio-ripple {
    height: 30px !important;
    width: 30px !important;
    left: calc(50% - 15px) !important;
    top: calc(50% - 15px) !important;
    border-radius: 50%;
}

我想居中的

import numpy as np
x = np.arange(1, 10)
x
output: array([1, 2, 3, 4, 5, 6, 7, 8, 9])

x:5
x
output: array([1, 2, 3, 4, 5, 6, 7, 8, 9])

1 个答案:

答案 0 :(得分:2)

您可以使用margin: 0 auto;left: 0;right: 0;将div居中。尝试下面的代码。

.header{
  min-height:85vh;
  width:100%;
  background-color:red;
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ), url('bck.jpg');
  position:relative;
  overflow:auto;
}

.header4 {
  background-color:yellow;
  height:200px;
  width:300px;
  font-size:48px;
  font-family: 'VT323', monospace;
  position:absolute;
  bottom:0;
  left: 0;
  right: 0;
  margin: 0 auto;
}
<div class = "header">
  <div class = "header1"><h1>-</h2></div>
  <div class = "header2"><h1>-</h1></div>
  <div class = "header3"><h1>-</h1></div>
  <div style = "clear:both"/>
  <div class = "header4">-</div>
</div>