Viscosity North America
logo-black
  • Data
    • Performance Assessment
    • Proactive Healthcheck
    • Database Migration & Consolidation
    • Performance Tuning
    • Microsoft Services
      • Microsoft Azure Services
      • Microsoft SQL Server Services
      • Microsoft Gold Azure Partner
    • Oracle Services
      • Oracle Database 19c
      • RAC
      • GoldenGate
      • Data Guard
      • Oracle & SQL Database
  • Apps
    • Oracle APEX
    • Viscosity AMP
  • Cloud
    • Hybrid Cloud
    • Viscosity Edge Cloud
    • Virtualization & Cloud Expertise
    • Microsoft Azure Services
  • Infrastructure
    • Exadata
      • Exadata Resale & Services
      • Engineered Systems Managed Services
    • Oracle Database Appliance
      • Oracle Database Appliance Resale & Services
      • ODA Health Checks
  • Events
    • Upcoming Events
    • 2023 Past Events
    • 2022 Past Events
  • About
    • Viscosity's Blog
    • Press Releases
    • Publications
    • Partnerships
    • Clients
    • Contact
Hit enter to search or ESC to close
ENGAGE WITH US

Application Development , Oracle , APEX , low code , Web Development

CSS Tips

By Alan Quigley
February 06, 2023

CSS can give your APEX app some color and a unique look. There are a lot of things that you can do, especially adding color. This is going to be the start of a series of useful CSS tips that can help you make your APEX app unique.

 

Let’s start with something super basic. Let change the font size of some Interactive Grid Headers. Within the CSS Inline field, we can add a CSS Declaration that looks like this:

 

 

.series{

   font-size: 25px;

}

 

We are going to declare that font size in pixels. This may take some tweaking to get it to the right size for you, but I am sure you will figure it out.

 

Now this won’t do anything until we tell APEX where to apply this. Let’s first do this on the header. So we will need to update the Heading value with the following code:


 

 

<div class="series">Series</div> 

 

Series will be the header name that you want to change the size of.

 

Before applying that CSS:

 

 

 

After:

 

 

 

You can really use this CSS anywhere. Let’s throw it on the Grid column itself, and increase the font size of the column.

 

 

 

Look at that difference. Huge, right?

 

You can use it on a page item header in the same way we did it for the grid header.

 

 

 

Again, a big difference. If your users want to have larger text anywhere on a page, this is a very easy way to accomplish that.

All posts
About Author
Alan Quigley

You might also like
World Cup Predictor App
World Cup Predictor App
February 06, 2023
Saving an Interactive Grid Cell on Change
Saving an Interactive Grid Cell on Change
February 06, 2023
SUBMIT YOUR COMMENT
logo for footer

Viscosity's core expertise includes:

Data Transformation, Emerging Technology, High Availability & Scalability Solutions, Cloud Migrations, Performance Tuning, Data Integrations, Machine Learning, APEX Development, and Custom Application Development.


Solutions

Resources

Events

Blog

About

 

Contact
Email: sales@viscosityna.com

Telephone:
(469) 444-1380

Copyright 2023. All Rights Reserved by Viscosity North America.