0
當我更改瀏覽器窗口大小時,居中放置在遠離其實際位置的進度圈中的文本和按鈕也改變其正常位置(位於中心在主容器)是這樣的:當改變瀏覽器窗口大小時,文本和按鈕在改變屏幕大小時發生位移
從圓心移動文本60還按鈕被推到了左側,這是最初在中心,我怎麼能留住他們到原來的位置,即使我改變瀏覽器窗口大小,這裏是css
我申請了
body{
margin: 0;
padding: 0;
}
.button1 {
float: right;
background-color: red;
width: 50%;
margin-right: 188px !important;
}
.main_container{
width: 80%;
margin: 0 auto;
height: 94%;
}
.card_styling{
background-color: lightgrey;
margin-top: 36px;
padding-top: 119px;
min-height: 63%;
}
.circle{
height: 16%;
float: right;
margin-top: -13%;
}
#time{
float: right;
margin-top: -10%;
margin-right: 5%;
font-weight: bold;
}
.title_styling{
margin-top: -87px;
margin-bottom: 97px;
}
.content_style{
margin-bottom: 32px;
}
<div class="card-container" class="main_container">
<md-card class="card_styling">
<md-progress-circle class="circle" mode="determinate"
[value]="rangeObs | async ">
</md-progress-circle>
<p id="time">{{percentage}}</p>
<md-card-title class="title_styling">Introduction to computer
</md-card-title>
<md-card-content>
<p class="content_style">some text</p>
<div *ngFor="let d of data">
<md-radio-button>
{{d.label}}
</md-radio-button>
</div>
<md-card-actions>
<button md-button class="button1">Submit</button>
</md-card-actions>
</md-card-content>
</md-card>
</div>`