Geek Answers Handbook

Angular material: md-select moves a container element

Here is jsfiddle

They seem to md-optionsinterfere with the body brand when the margin-margin directive is applied.

HTML:

<body style="background-color: orange;" layout="row" ng-controller="AppCtrl" ng-app="StarterApp" layout-margin layout-fill>
  <div flex="35" class="md-whiteframe-z1 white">
    <md-select placeholder="Pick" ng-model="someVal">
      <md-option value="1">One</md-option>
      <md-option value="2">Two</md-option>
    </md-select>
  </div>
</body>

How can I avoid this annoying collision? The edge should be.

+4
source share
1 answer

What you need is a container md-content.

The documentation on is md-contentpretty limited: https://material.angularjs.org/latest/#/api/material.components.content/directive/mdContent

. , /- , "" md.

:

<md-content>
  <md-select placeholder="Pick" ng-model="someVal">
    <md-option value="1">One</md-option>
    <md-option value="2">Two</md-option>
  </md-select>
</md-content>

Fiddle: https://jsfiddle.net/bgo6z1nm/1/

UPDATE: , md-content. , . , , CSS .

+3

More articles:


All Articles