I have used "core-header-panel" element of Polymer in my application, However Not sure why contents inside div is not visible.
Complete code at - http://jsfiddle.net/ilovenagpur/5rm4eznm/1/
please suggest if i am missing something here.
Code Snippet :
<body fullbleed unresolved vertical layout>
<core-header-panel >
<core-toolbar class="medium-tall">
<div flex>I am Heading</div>
<core-icon-button icon="search"></core-icon-button>
<paper-tabs class="bottom fit" selected="0">
<paper-tab>This Week</paper-tab>
<paper-tab>Next Week</paper-tab>
<paper-tab>History</paper-tab>
</paper-tabs>
</core-toolbar>
<div class="content">
THIS <br />
COMPONENT <br />
IS NOT <br />
VISIBLE <br />
THIS <br />
COMPONENT <br />
IS NOT <br />
VISIBLE <br />
THIS <br />
COMPONENT <br />
IS NOT <br />
VISIBLE <br />
THIS <br />
COMPONENT <br />
IS NOT <br />
VISIBLE <br />
<footer layout vertical center>
<div >I am footer</div>
</footer>
</div>
</core-header-panel>
</body>
Via the secend video on this page:
Both
core-header-panel
itself and the parent (body
in your code), need an explicit height set.
So I guess you may wanna try <core-header-panel flex>
update:
I tried your code, the problem is in your stylesheet.
Those "invisible" text are actually "under" the core-toolbar.
I was able to fix issue. and achieved desired output without core-header-panel
, Here is working code.
http://jsfiddle.net/ocw5x2aL/8/
Thanks namiheike for your help and suggestions.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.