1
예상 한대로 작동하지 않는 폴리머에서 컨테이너 요소 내의 일부 요소 너비를 설정하고 싶습니다. 여기에 몇 가지 작은 예입니다폴리머로 스타일을 지정할 때 부모의 너비/높이를 고려하십시오.
<!doctype html>
<html>
<head>
<base href="https://polygit.org/polymer+:master/webcomponents+:master/shadycss+webcomponents+:master/components/">
<script src="webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="polymer/polymer.html">
<link rel="import" href="paper-input/paper-input.html">
</head>
<body>
<dom-module id="my-container">
<template>
<paper-input label="Test"></paper-input>
</template>
<script>
class MyContainer extends Polymer.Element {
static get is() {
return 'my-container';
}
}
customElements.define(MyContainer.is, MyContainer);
</script>
</dom-module>
<dom-module id="my-element">
<template>
<style>
#pblock {
width: 50%;
}
</style>
<my-container id="pblock"></my-container>
</template>
<script>
HTMLImports.whenReady(function() {
class MyElement extends Polymer.Element {
static get is() { return 'my-element'; }
}
customElements.define(MyElement.is, MyElement);
});
</script>
</dom-module>
<my-element></my-element>
</body>
</html>나는 50 %의 폭 컨테이너를 설정합니다. 해당 컨테이너 내의 용지 입력이 너비 100 %로 설정되었으므로 상위의 100 %, 즉 문서의 50 %를 고려한다고 생각했습니다. 그러나 용지 입력은 전체 너비를 차지하고 컨테이너의 50 %에 반응하지 않습니다. 내부 요소 (이 경우 용지 입력)가 퍼센트 참조로 사용할 수 있도록 컨테이너의 너비 (또는 높이)를 어떻게 설정할 수 있습니까?
도움 주셔서 감사합니다. 당신이 줄이 정렬 중심하려는 경우 container이 display: block
-display: inline 변화를 가지고 있기 때문에