Skip to main content

Notifications

Power Pages - General Discussions
Suggested answer

Search Results page - how to edit the styling

(0) ShareShare
ReportReport
Posted on by
Hi All,
 
I have built a Power Pages site which combines Web Pages and data from a Model Driven App. We want to open up the Dataverse Search function to users but the current styling does not suit us. See below for some of the items we want to address:
  • The search text box is so small the search phrase is not visible
  • The content at the top is centred and we want it left justified
  • We want to remove the bullet point
  • We want to get remove the excess white space
My question is: Where can I edit this page? I though the Search Results.html Web template, but adding Styling there has no effect. 
 
Many thanks,
 
Categories:
  • Suggested answer
    SwatiSTW Profile Picture
    SwatiSTW 301 on at
    Search Results page - how to edit the styling
    1. To make the Search Box Bigger - Add this CSS to increase the size of the search box.
    input[type="search"] {
        width: 100%;
        max-width: 500px; /* Adjust width as needed */
        font-size: 16px;
    }
    2. The search section is centered because of styling. Override it with:
    .search-container {
        text-align: left !important;
    }
    3. The bullet point is coming from a list (ul or li). Remove it with:
    .search-results ul {
        list-style-type: none;
        padding-left: 0;
    }
    4. White space is likely caused by extra padding or margin. Reduce it with:
    .search-container {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
    You can put this css code in using below steps
    Go to Power Pages Studio → Open Themes.
    Find Site Settings → Click Web Files.
    Add this CSS to an existing custom CSS file or create a new one.
    If you don't have a CSS file, you can also add this CSS in the Header Web Template

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

Quick Links

Microsoft Kickstarter Events…

Register for Microsoft Kickstarter Events…

Announcing Our 2025 Season 1 Super Users!

A new season of Super Users has arrived, and we are so grateful for the daily…

Announcing Forum Attachment Improvements!

We're excited to announce that attachments for replies in forums and improved…

Leaderboard

#1
WarrenBelz Profile Picture

WarrenBelz 145,422

#2
RandyHayes Profile Picture

RandyHayes 76,287

#3
Pstork1 Profile Picture

Pstork1 64,711

Leaderboard