Where to find CSS applied for a page
Question
Application Type
Reactive

I am creating a layout popup and not applying any CSS to it. But on accessing it in web, i am seeing CSS applied. How to find the CSS applied for a web screen. I can see it in Chrome with inspect element under element.style{} but not able to see it in outsystems.

Hi @Manjeet Mishra,

refer below screenshot.. click CSS for the page

and you will find css things for the screen. (switch tabs for module and app css)


Hello,

In addition to above, Please go through this Learning lessons -
Getting Started with OutSystems for Front-end Developers-

 https://www.outsystems.com/training/courses/168/getting-started-with-outsystems-for-front-end-developers/

 And please go to this link it is it is nicely explained-

https://success.outsystems.com/Documentation/11/Developing_an_Application/Design_UI/Look_and_Feel/Cascading_Style_Sheets_(CSS)

Hi Manjeet,

As Aadhavan shared where to open CSS editor.

In addition you can find in this CSS document detail information such as

  • Applying CSS with the class attribute.
  • Editing CSS
  • CSS Specificity <- this is important because you will know priority and order Outsystems Studio imports CSS and the rule "The last style to be applied has the highest priority ".
  • Inline CSS
  • Outsystems Grid
  • Importing CSS
  • Preprocessors

Regards,

Khuong

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.