diff --git a/index.d.ts b/index.d.ts
index 07e1dcf..c9a569a 100644
--- a/index.d.ts
+++ b/index.d.ts
@@ -33,7 +33,7 @@ export interface CollapsibleProps extends React.HTMLProps<Collapsible> {
     | "inherit"
     | "initial"
     | "unset";
-  triggerSibling?: React.ReactElement<any>;
+  triggerSibling?: string | React.ReactElement<any> | function;
   className?: string;
   tabIndex?: number;
   contentContainerTagName?: string;
diff --git a/src/Collapsible.js b/src/Collapsible.js
index 965a5c5..f5bc638 100644
--- a/src/Collapsible.js
+++ b/src/Collapsible.js
@@ -124,10 +124,11 @@ class Collapsible extends Component {
       return (
         <span className={`${this.props.classParentString}__trigger-sibling`}>{this.props.triggerSibling}</span>
       )
-    } else if (this.props.triggerSibling) {
-      return <this.props.triggerSibling />
+    } else if (typeof this.props.triggerSibling === 'object') {
+        return this.props.triggerSibling
+    } else if (typeof this.props.triggerSibling === 'function') {
+        return <this.props.triggerSibling />
     }
-
     return null;
   }
 
@@ -179,6 +180,7 @@ class Collapsible extends Component {
       && !this.state.inTransition ? null : this.props.children;
 
     // Construct CSS classes strings
+    const headerClassString = `${this.props.classParentString}__header`;
     const triggerClassString = `${this.props.classParentString}__trigger ${openClass} ${disabledClass} ${
       this.state.isClosed ? this.props.triggerClassName : this.props.triggerOpenedClassName
       }`;
@@ -190,23 +192,25 @@ class Collapsible extends Component {
 
     return (
       <ContentContainerElement className={parentClassString.trim()} {...this.props.containerElementProps} >
-        <TriggerElement
-          className={triggerClassString.trim()}
-          onClick={this.handleTriggerClick}
-          style={this.props.triggerStyle && this.props.triggerStyle}
-          onKeyPress={(event) => {
-            const { key } = event;
-            if (key === ' ' || key === 'Enter') {
-              this.handleTriggerClick(event);
-            }
-          }}
-          tabIndex={this.props.tabIndex && this.props.tabIndex}
-          {...this.props.triggerElementProps}
-        >
-          {trigger}
-        </TriggerElement>
-
-        {this.renderNonClickableTriggerElement()}
+        <div className={headerClassString}>
+            <TriggerElement
+              className={triggerClassString.trim()}
+              onClick={this.handleTriggerClick}
+              style={this.props.triggerStyle && this.props.triggerStyle}
+              onKeyPress={(event) => {
+                const { key } = event;
+                if (key === ' ' || key === 'Enter') {
+                  this.handleTriggerClick(event);
+                }
+              }}
+              tabIndex={this.props.tabIndex && this.props.tabIndex}
+              {...this.props.triggerElementProps}
+            >
+              {trigger}
+            </TriggerElement>
+
+            {this.renderNonClickableTriggerElement()}
+        </div>
 
         <div
           className={outerClassString.trim()}