web
You’re offline. This is a read only version of the page.
close
Skip to main content

Announcements

Welcome to the Power Platform Communities
The Next Big Bite | Aussie Classics & Starting Small with Clay Wesener | EP04
News and Announcements icon
Community site session details

Community site session details

Session Id :
Power Platform Community / Forums / Power Apps / PCF - custom dropdown ...
Power Apps
Unanswered

PCF - custom dropdown list not visible

(0) ShareShare
ReportReport
Posted on by tzalar 3

Hi! 

 

I created custom PCF dropdown component, using Semantic UI Dropdown Component. When dropdown list opens, it is hidden behind "parent" div. I tried all CSS tricks that I could think of, and nothing solved my issue, the list is still falling behind the field container where pcf is placed. I want the dropdown to fall over the container.

 

Anyone faced similar issue and how did you solve it? 

 

 

tzalar_0-1601365443797.png

 

Categories:
Power Apps Pro Dev & ISV
I have the same question (0)
  • ScottDurow Profile Picture
    ScottDurow 1,039 on at

    This looks like an issue similar to - https://github.com/Semantic-Org/Semantic-UI/issues/3246#issuecomment-359221980

    It seems to be due to the way that Material UI creates the drop down inline - rather than a dom element added to the end of the document.

     

  • David Pezzoli Profile Picture
    David Pezzoli 230 on at

    I have the same issue....

    I see that you can't reference all semantic.css file to PCF because impact to model-driven app form layout, see this link

     

    "When you implement styling to your code components using CSS, ensure that the CSS is scoped to your control using the automatically generated CSS classes applied to the container DIV element for your component. If your CSS is scoped globally, it will likely break the existing styling of the form or screen where the code component is rendered. If using a third-party CSS framework, use a version of that framework that is already namespaced or otherwise wrap that framework in a namespace manually either by hand or using a CSS preprocessor."

      

    So, using Semantic-UI-react for me it's very difficult in PCF because using Semantic UI Theming need another unused reference: craco....

     

    ...How did you solve the problem? 

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

News and Announcements

Welcome to the Power Platform Communities
The Next Big Bite | Aussie Classics & Starting Small with Clay Wesener | EP04

Quick Links

Season of Sharing Community Challenge Winners!

Congratulations to our community stars!

Kudos to our 2025 Community Spotlight Honorees

Expanding mentorship, skilling, and AI innovation

Congratulations to the June Top 10 Community Leaders!

These are the community rock stars!

Leaderboard > Power Apps

#1
WarrenBelz Profile Picture

WarrenBelz 326 Most Valuable Professional

#2
11manish Profile Picture

11manish 168

#3
sannavajjala87 Profile Picture

sannavajjala87 75 Super User 2026 Season 1

Last 30 days Overall leaderboard

Featured topics

Auto-Populate field Power Pages
Gallery Tabs - Show or Hide Tabs based on Field Value
How to patch multiple records at once
Enable Copilot for end users in model-driven apps
Question for everyone : How are you using Create Text GPT in AI Builder?
Community content - sample components, blogs etc. - Link to this page (http://aka.ms/PCFdemos)
Welcome to the Power Apps forum!

Product updates

Microsoft Power Platform Community release plans