md-datepicker가 사용자 정의 여백을 무시합니다.

내 프로젝트에서 AngularJS Material datepicker를 사용하고 있으며, 불행히도 무시하는 맞춤 CSS를 사용 중입니다. md-datepickermd-datepicker가 사용자 정의 여백을 무시합니다.

Demo

여기에 코드 조각입니다 :

angular.module('myApp',['ngMaterial'])

body{background-color:white} 
 
.datePicker{ 
 
    margin-top:100px; 
 
}

<head> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
    <!-- Angular Material style sheet --> 
 
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.css"> 
 
</head> 
 
<body ng-app="myApp" > 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-animate.min.js"></script> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-aria.min.js"></script> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-messages.min.js"></script> 
 

 
    <!-- Angular Material Library --> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.js"></script> 
 

 
    <label>User Date</label><br> 
 
<md-datepicker ng-model='userDate' class="datePicker md-primary"></md-datepicker> 
 
    
 
</body>

출처

2017-12-15 Aravind Reddy

당신이 확인하고 솔루션 작동하는지 알려주세요 수 있습니까? –

감사합니다. –

그것은 복용,하지만 display은 옳지 않다. <md-datepicker>에 적합한 display을 설정

.datePicker { 
    margin-top: 100px; 
    display: block; 
}

미리보기

펜 : https://codepen.io/anon/pen/ppJXeb

출처

2017-12-15 11:52:59

md-datepicker가 사용자 정의 여백을 무시합니다.

답변

관련 문제