2

I'm trying to use the fabric List component in an spfx webpart. The code below was taken directly from https://dev.office.com/fabric#/components/list

return (
     <div >
      <div className='ms-ListItem is-unread is-selectable'>
      <span className='ms-ListItem-primaryText'>Title</span>
      <span className='ms-ListItem-tertiaryText'>Description</span>
    </div>

    )

The Title and description appear in exactly the same font. Is there something special I need to do to get the fabric css included in an spfx webpart?

I tried including

require('../../../node_modules/office-ui-fabric-react/dist/css/fabric.css');

but it made no difference

2
  • Needed to include require('../../../node_modules/office-ui-fabric/dist/css/fabric.component..css');
    – RussGove
    Commented Jun 6, 2017 at 20:11
  • manually requiring the above broke the drop downs and some other components in my app. i ended up reverting that change, the css classes noted in my question are not included in the office ui fabric react css so they have no effect. i have no idea why. ended up using custom css.
    – RussGove
    Commented Jun 14, 2017 at 1:01

1 Answer 1

0

So,

What does F12 Network tab reveal?
Any Fabric trying to load?
And from what URI? (I think you will see a 404 here)

You can reference Fabric from the CDN:

//spoprod-a.akamaihd.net/files/fabric/office-ui-fabric-core/7.0.0/css/fabric.min.css

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.