Question

我有以下问题。

我创建了一个新的pollymer元素，我试图让它填满整个页面。

问题是身体没有到达整个页面：/

这是我调用我的元素的页面：

<!DOCTYPE html>
<html xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
    <META http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <META name="viewport" content="width=device-width, initial-scale=1.0" />
    <h:outputStylesheet library="css" name="style.css" />
    <script src="bower_components/webcomponentsjs/webcomponents.js" />
    <link rel="import" href="bower_components/polymer/polymer.html" />
    <link rel="import" href="my_polymer_elements/top_bar.html" />
    <link rel="import" href="my_polymer_elements/left_bar.html" />

    <title>Patrimônio</title>
</h:head>
<h:body>
    <!-- <my-top_bar userName="Thiago Kairala" profile="Administrador geral"></my-top_bar>-->
        <my-left_bar />
</h:body>
</html>

这是我的元素：

<link rel="import" href="../bower_components/polymer/polymer.html" />
<link rel="import" href="menu.html" />

<polymer-element name="my-left_bar" attributes="systems departments">

 <template>
    <style>    
      :host {
        position: relative;
        display:block;
        height: 100%;
  }
  .left-bar {
    width: 15%;
    height: 100%;
    background-color: #ffcc29;
    border: 0;
    margin: 0;
  }
</style>

<div class="left-bar" start>
    <div class="menus">
        <my-menu />
        <my-menu />
    </div>
</div>

</template>



 <script>
     Polymer({
       });

    </script>

    </polymer-element>

并且我做了身体，身高{margin：0;身高：100％;}

Answer 1

https://www.polymer-project.org/0.5/docs/polymer/layout-attrs.html。尝试fullbleed或fit属性

聚合物定位不会100％

1 个答案: