JSP not able to render CSS properly

Trying to apply some basic CSS to my JSP page. The JSP is located at WebContent > WEB-INF > pages > Login.jsp, while the CSS file is at WebContent > WEB-INF > css > Login.css.

Below is my JSP code:

<head>
<link rel="stylesheet" type="text/css" href="../css/Login.css" />
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Login Page</title>
</head>
<body>
    <div>
        <form method="post">
            <table>
                <tr>
                    <td>
                        //some code
                    </td>
                </tr>
                <tr>
                    <td>
                        //some code
                    </td>
                </tr>
                <tr>
                    <td>
                        //some code
                    </td>
                </tr>
            </table>
        </form>
    </div>
</body>

And here is my CSS:

table {
    border-width: 1px;
    border-color: black;
    border-style: solid;
}

No borders are showing around the table despite applying styling. Any insights on why this might be happening?

Answer №1

It's possible that the issue lies in the path to your CSS file. To troubleshoot, start by relocating your pages and CSS folder from the WEB-INF directory to a location adjacent to it. After doing so, consider using this updated code snippet:

<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/Login.css" /> 

Answer №2

If you happen to be utilizing the tomcat plugin within eclipse, give this a shot: right-click on the server and select clean. I encountered a similar issue where the css file wasn't being properly updated by the server. Performing a clean operation will refresh all of the files and hopefully resolve the issue.

Just a suggestion to consider.

Answer №3

If you're unsure about what "../" resolves to in your browser, try using "./" as an alternative. To do this, open the developer tools in your browser (for example, press F12 in Chrome) and navigate to the network tab. As you browse your page, observe the outgoing requests. Look for the request for your Login.css stylesheet and hover over it to view the complete path being used. Confirm if this path is correct for your needs.

Answer №4

To easily set up your website, simply duplicate both folders and paste them into the web content directory. Update the file path in the code snippet below:

link rel="stylesheet" type="text/css" href="../css/Login.css"

Make sure your directory structure resembles this: /WebContent/pages/Login.jsp, with your CSS file located at /WebContent/css/table.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

Difficulty enforcing mandatory checkboxes

Seeking assistance on making checkboxes required. I am creating a form using bootstrap 4 and validating it using the JS example from bootstrap documentation. I have added "novalidate" to the form, "required" to inputs, and included the following script: ...

Running Server Jar Programmatically with Caucho Resin

After successfully utilizing the Caucho Resin web server, I am contemplating packaging it into a java application. They supply a jar file and code to initiate the server programmatically. Example: example/TestResin.java package example; import com.cauch ...

On the initial page load, Magento is failing to load the CSS properly

I've been tinkering with the Magento website over at For some reason, the CSS on the Home page doesn't load initially, but it loads fine when you click on any other link like Products or Gallery. Any ideas why this might be happening? Thanks in ...

When a method receives an array as an argument and tries to find a specific key, it will only return the else

I passed an integer array to a method and tried searching for a KEY, but it keeps returning "NOO" even when the key is present. class ArraySearch { public static void main(String[] args) { int[] arr={1,2,4,4,5}; int k=5; ...

The styled component is not reflecting the specified theme

I have a suspicion that the CSS transition from my Theme is not being applied to a styled component wrapped in another function, but I can't pinpoint the exact reason. I obtained the Basic MUI Dashboard theme from this source and here. Initially, inte ...

IE11 retains radio button selection even after page reload

I am facing an issue on my webpage where I have implemented radio buttons for filtering a list. ALL (default selected with checked='checked') MATCHED REST <input type="radio" value="ALL" name="options" class="radioStyle" checked autocompl ...

What is the best way to ensure a div element on a printed page has a space between its bottom edge and the physical paper, as well as a space between its top

Within my div element lies a collection of other div elements. These elements contain lengthy text that may span multiple pages. I am attempting to print this text starting 50mm from the top edge of every physical paper, and stopping 20mm before the edge o ...

Adding a new entry to the local SQLite database upon receiving a push notification from Firebase Cloud Messaging

I attempted to write to a local SQLite database within the onMessageReceived method of a class Notification that extends FirebaseMessagingService. Unfortunately, I have not been successful with this endeavor. The notification is received on the phone and ...

Struggling to resolve a basic issue with the header on a straightforward HTML webpage

Task is as simple as it gets, yet I can't seem to grasp it. I put together a basic HTML Snippet. Check out my Code Pen In the pen, there are 3 nested divs, with div1 serving as the main div for my React Application. The background color of the body i ...

Nested floating elements

Consider the layout below <div style='float: left;'>Outer Div </div> <div style='float: left;'> <div style='float: left;'>Inner Div </div> <div style='float: left;'>Inne ...

Best methods for deleting an element's attribute or style attribute

Imagine this snippet of CSS code: .notif-icon { display: inline-block; } In my HTML, I have the following element which starts off hidden by overriding the display property of the notif-icon class: <span id="error" class="notif-icon& ...

Is there a method available that allows us to return to the try block from the catch block?

During the execution of a code in Selenium webdriver, if an element is not found, it goes to the catch block. However, I want Java to continue the execution after skipping that specific element. import java.util.regex.Pattern; import java.util.concurrent. ...

Issue with Selenium: Unable to input text into the designated input field

The click Event is functioning properly, however, the sendKeys event is not working as expected. Here is a snippet of my code: driver.findElement(By.id("radio-1-4")).click(); jse.executeScript("scroll(0, 500);"); System.out.println("Authority Filter") ...

A plug-in for TinyMCE that allows users to adjust column widths within a table

We utilize TinyMCE in our content management system (CMS), and our users have expressed interest in being able to adjust the width of a column within a table. While HTML technically does not recognize columns, the Moodle editor HTMLAREA includes a plugin t ...

Styling a rectangle in p5.js: Tips and tricks

In my p5.js code, I created a rectangle using rect(): rect(10, 10, 10, 10); Now, I want to add some style to it with a box-shadow effect: box-shadow: 20px 20px 50px #00d2c6, -30px -30px 60px #00ffff; However, when I tried to apply the style using the doc ...

When data is submitted through the POST method, it mysteriously disappears

When I send the "user" variable to another page called Survey.php, here's how it looks: In the index.html file: <form action="Survey.php" method="post" name="frm"> <div><input type="text" name= ...

How to store large files in Java using MongoDB 3.0

Currently, I am working with Mongo db 3.0 in Java and have come across a situation where the document size exceeds 16MB. The issue arises when I have a list of primary keys (unique records) that need to be stored as an embedded collection within a document ...

What is the reason behind the jQuery only functioning properly on Internet Explorer 8 on this particular page and no other browsers?

I recently created a webpage utilizing jQuery: The functionality on the page should change music images to represent different key signatures when switching from 'Higher Key' to 'Lower Key' in the combo box. While this works perfectly ...

Is there a way to accurately measure the loading time of a Mobile Application page by utilizing Appium and Java?

Hey there, I'm looking to determine the page loading time of a Mobile app as it transitions between screens for our Mobile Application. This is the process I have attempted so far: Before interacting with an element, I capture the current time in mi ...

What is the process for altering the colors of HTML form elements shown in UIWebView?

My application opens HTML pages in a UIWebView with a specific color theme that gets disrupted by form elements on the page (including "select" fields) which have their own color scheme of white font and light gray background. Despite trying CSS adjustment ...