locked
How to style the hub section headers?

    Question

  • How do you style the hub section headers when using the hub template in windows 8.1 store app(html version)?

    Here is the header in the hub.html:

        <div class="section1" data-win-control="WinJS.UI.HubSection" data-win-options="{ isHeaderStatic: true }" data-win-res="{ winControl: {'header': 'Section1'} }">

    I have tried using:

        .hubpage .hub .section1 .win-hub-section-header {
            font-family: AmdtSymbols;
            font-size: x-large;
            margin-left: 300px;
        }

    The margin-left property is working but not the font styling.
    Thursday, October 09, 2014 12:59 PM

Answers

  • Hi!

    Try using:

    .hubpage .hub .section1 .win-hub-section-header-content {
    	font-family: AmdtSymbols;
            font-size: x-large;
            margin-left: 300px; }

    • Proposed as answer by Ealsur Friday, October 10, 2014 12:13 PM
    • Marked as answer by bliks07 Sunday, October 12, 2014 1:19 PM
    Thursday, October 09, 2014 4:36 PM

All replies

  • Hi!

    Try using:

    .hubpage .hub .section1 .win-hub-section-header-content {
    	font-family: AmdtSymbols;
            font-size: x-large;
            margin-left: 300px; }

    • Proposed as answer by Ealsur Friday, October 10, 2014 12:13 PM
    • Marked as answer by bliks07 Sunday, October 12, 2014 1:19 PM
    Thursday, October 09, 2014 4:36 PM
  • It's working. Thank you so much!
    Friday, October 10, 2014 5:06 AM
  • I'm glad it worked :DPlease mark the answer so it will help others with the same problem :)
    Friday, October 10, 2014 12:13 PM