The Oracle Apex Login Interface with a Touch of Customized Styling

Currently, I'm working on creating a login page in Oracle APEX. While modifying the icon using CSS code, everything seems to be falling in place except for this one particular line:

.t-Login-logo {
background-image:url(#APP_FILES#LogoUpdated.jpg);
background-size:cover;
width:302px;
height:100px;
}

Strangely enough, only the background-image property is not taking effect while the other styles are working perfectly fine. Any ideas on what could be the issue?

I appreciate any help you can provide.

P.S.: The changes I made are within the inline section of the CSS page attributes in Oracle Application Express.

htmlcssoracle-apex

Answer №1

When working with APEX, it's important to note that the substitution strings in your page for "Inline CSS" are not resolved. To resolve this issue, it is recommended to move your CSS class to a new file, such as style.css:

.t-Login-logo {
  background-image:url('LogofinitoJ-removebg.jpg');
  background-size:cover;
  width:302px;
  height:100px;
}

Next, add the file reference to the page section CSS under File URLs, using #APP_IMAGES#style.css.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Utilize a component's CSS styles by inheriting them and applying them to another component

I have created custom styles for an object as shown below: form#sign_in{ position:relative; margin:85px auto 50px auto; width:455px; background:#fff; border:#dfdfdf 1px solid; border-radius:5px; -moz-border-radius:5px; -web ...

css

Clicking to close tabs

I am currently working on implementing a tab functionality on my website and I want these tabs to be responsive. Here is the code snippet I have been using: function openCity(evt, cityName) { var i, tabcontent, tablinks; tabcontent = document.ge ...

javascriptjqueryhtmlcss

Painting Magic: Exploring the World of Canvas Zoom and Moves

I'm having trouble implementing zoom and pan functionality for this particular canvas drawing. While there are examples available for images, my case is different since I am not working with images. Any tips or suggestions on which libraries to use wo ...

javascriptjqueryhtmlcanvashtml5-canvas

Struggling to locate element using Selenium in Python 3?

While using Selenium for WebScraping, I've encountered difficulty detecting an element using xpath, full xpath, id or text. <div id="cbp-vm" class="cbp-vm-switcher cbp-vm-view-list"> <div class=cbp-vm-options">...& ...

pythonhtmlselenium

Implementing a JQuery script that triggers every time there is a change in the scroll

This script creates a shrinking effect on a box followed by a fade-in/out transition when the scroll position changes. However, the issue is that it triggers every time there is a scroll position change. For example, if the scroll position is at 100px and ...

jqueryhtmlcss

If the cursor hovers over an image, the onmouseover function does not work properly

Currently, I am developing a PHP page to display data from a database in a tabular format. Each column in the table represents an 'ATC Station'. When active, additional data is displayed upon hovering over the cell. Everything was running smooth ...

javascriptphphtmlevents

css malfunctioning user interface

I'm struggling to figure out how to design a CSS toolbar. My goal is to create a 22x22 button toolbar with 4 buttons. I have this PNG image: and the following code: <style> #nav {background: url(content/images/crtoolbar.png) no-repeat;height: ...

htmlcss

Customizing a Google chart legend to show on hover event

Utilizing the Google Chart API, I have created a line chart to display my data. To customize the legend, I initially set the chart's original legend to none and then designed my own legend according to my preferences. While everything is functioning ...

javascripthtmljquerychartsgoogle-visualization

Switch up your code and toggle a class on or off for all elements that share a specific class

I've been attempting to create a functionality where, upon clicking a switch, a specific class gets added to every element that is assigned the class "ChangeColors". Unfortunately, I have encountered some difficulties in achieving this task. The error ...

javascriptcss

Discover additional and subtract options

I am trying to implement a "See more" and "See less" button functionality for my list items inside an unordered list using the code below, but it is not working as intended. $(document).ready(function() { var list = $(".partners__ul li"); var numTo ...

javascriptjqueryhtml

What is the best approach to extracting tightly-coupled code and converting it into an external library?

I have a question regarding paradigms that I would like to address, and if this is not the appropriate platform, please guide me to the right place. Your recommendations are most welcome :) Currently, I am tasked with extracting a significant piece of fun ...

javascripthtmlparadigms

Limiting the character input in ion-textarea within Ionic 2: A step-by-step guide

In my Ionic 2 application, I need to limit user comments to less than 500 characters in a text area. What is the best way to implement this restriction? ...

csstypescriptionic-frameworkionic2

Styling HTML Text Using Your Own Unique CSS Class Style

After developing some CSS classes to define specific hex colors for my web application, I ran into issues applying these styles to text in the HTML. Despite my best efforts, I am struggling to make the styles show up as intended. CSS .custom-orange-color ...

htmlcss

Developing a fresh Outlook email using a combination of javascript and vbscript

I have created a custom HTML page with fields and a button to fill out in order to generate a new Outlook mail item. To format the body of the email using HTML, I am utilizing VBScript to create the new mail item. <script> function generateEmail() { ...

javascriptjqueryhtmlvbscriptoutlook

Tips for preventing browsers from losing style information stored in inputs

My custom input field has unique CSS styles applied to it, but unfortunately, when the browser auto-fills the information in those fields, the styles get reset. ...

cssbrowser

What is the best way to create a CSS grid with horizontal overflow?

I'm currently working on a 4-column layout using CSS grid. As the browser width reaches a specific breakpoint, I want the first column to be fixed on the left side of the browser (X-axis) while the other columns scroll under it. Right now, I am utiliz ...

htmlcsscss-grid

Apply a coating of white paint and add color to the border

I was struggling to create a form that has a white background color and a green border at the same time. I am using Bootstrap and it seems like I cannot apply both styles simultaneously. Here is the link to the form design I am trying to achieve: . Below ...

htmlbootstrap-4

Harnessing conflict in HTML with various versions of jQuery can be a powerful tool for enhancing the

Is it possible to use 2 different jQuery libraries on the same HTML page? I came across some blogs mentioning conflicts, but when I tried to add them both, I had no luck. Can anyone assist me with this? Here is my code: Product slider <link hre ...

jqueryhtmlcssconflict

Is it possible to dynamically load a specific div when the page loads, relying on the

I am using JQuery SlideUp and slideDown methods to toggle the visibility of panels. How can I load or display the first record's contact information as a default? Currently, it loads blank because I set the panel's display property to none: < ...

javascriptjqueryhtmlcss

Trouble encountered in adjusting the alignment of labels

I'm struggling with aligning my links properly. https://i.sstatic.net/W5G4Z.png I want Yesterday This week This month to line up perfectly with the DateTime From and Last 2 days Last 7 days Last 30 days labels for DateTime To. This is how it appear ...

htmlcssalignment