Unable to properly link CSS files

One of the students I am teaching has written the following code snippet:

    <title> Portfolio
    </title>
    <link rel="stylesheet" type="text/css" src="portfolio1style.css">
</head>

The portfolio1style.css file is located in the same directory as the HTML file and is spelled correctly. When we include the CSS internally, it works fine. What could be causing this issue? Thank you.

Answer №1

Consider using href="portfolio1style.css" in place of src

Answer №2

Here is the desired appearance:

<link rel="stylesheet" type="text/css" href="portfolio1style.css">

Remember to change src to href

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

Resolving AJAX requests within a loop

I am working with a JSON file that contains widgets {"widgetname": "widget1", "widgetID": "FJRH585fKFJN234NC"} As I iterate through the JSON, I generate HTML for each widget object. $.ajax({ url: "get_json.php", data: {action: "get_widgets", ...

Is there a way to implement tooltips on an element that has text-ellipsis enabled?

I am facing an issue with displaying an account number that exceeds 100 characters. I need to restrict the display with overflow hidden while still being able to show the full account number using a tooltip. Below is the code snippet: <span class="tex ...

Python Selenium - The Select method can only be used with <select> tags, not <div> tags

Seeking guidance on selecting an element from a dropdown box on a work website using web scraping and selenium. As a newcomer to this technology, I am struggling and looking for some assistance in the right direction. Unlike other scenarios I have come acr ...

Trouble with toggling class "collapsed" in Bootstrap v3 Navbar-toggle when using multiple data-targets

When using the data-target attribute with multiple CSS selectors, the behavior of toggling the "collapsed" class in navbar-toggle does not work as expected. If only one selector is used, the class is toggled properly, but when multiple selectors are specif ...

I am looking to preload a separate webpage prior to the HTML loading in AngularJS

I am looking to implement a feature in my AngularJS app where a different webpage (e.g. google.com) will be loaded based on the response of a REST API before any default HTML content is displayed. I have attempted to make a REST service call within a fact ...

Creating responsive images in a navbar with HTML and CSS

I need help with this code snippet: <div> <nav class="navbar navbar-expand-lg navbar-light bg-light"> <div class="container"> <div class="d-flex flex-row justify-content-center align-items-center"> <a cla ...

How can I prevent the content from sliding out of view in a Bootstrap carousel?

I am looking to create a slider that includes a form or text. However, I have noticed that when scaling up by 50-75% or when there is a lot of content, the content extends beyond the slider. Image Check out my code on jsfiddle: jsfiddle.net/sL70r2an/ ...

No display of Tailwind updates on local server in Safari browser using NextJS and a Mac M1

For my personal project with NextJS, I am using Tailwind CSS, but I am experiencing frequent issues with updating styles. It seems like there is a 50/50 chance that Tailwind will apply the styles to the component properly, and sometimes I have to go throug ...

Having trouble with JSON/jQuery syntax?

I am attempting to populate a set of DIVs with image backgrounds by reading images from a specific folder. The jQuery code I have written is shown below: $.getJSON('../functions.php', function(images) { images.each( function() { $('#m ...

What is the best approach to modifying the color of a menu item in the sidebar upon clicking it using Material-UI in a React application?

I am a beginner with this framework and my goal is to change the color when clicking on a Menu Item in the Sidebar. For example, clicking on the table component should change the table name and icon to white color. Could someone please help me figure out h ...

Utilizing DataTables to dynamically populate a table with data fetched from an AJAX request

I'm currently in the process of developing a program that showcases various topics within a specific subject. My main query revolves around whether or not the DataTable functionality will be compatible with this particular setup. The following is th ...

"Utilizing the power of Angular 6's JSON pipe

Looking for a well-structured formatted JSON, but all I get is confusion and this strange image: https://i.sstatic.net/6mvBu.png Does anyone have any insights on what might be causing the issue? HTML <span style="font-weight: 500;">Payload Data: ...

Create a Cutting-edge Navbar in Bootstrap 5.1 Featuring Three Distinct Sections: Left, Center, and Right

I'm encountering challenges with formatting the navbar layout I am currently designing. My goal is to create a navbar with three distinct sections as outlined in the title. In the first section on the left, there should be an image and a button-like ...

"In Internet Explorer, the option tag can be set to display as either block or

Here is an updated issue related to my previous question. I currently have a flawless code (DEMO) that works perfectly in Chrome and Firefox. However, it does not function properly in Internet Explorer. This is because IE does not support the use of displ ...

Retrieve container for storing documents in JavaServer Pages

Previously, I created JSP and HTML code to upload a file from the hard disk into a database using <input type="file" name="upfile"> However, a dialog box with an "Open" button is displayed. What I am looking for is a "Save" button that will allow u ...

Is there a way to prolong the disappearance of a dropdown menu trigger?

Is there a way to keep a dropdown menu displayed for a short period after hovering off a logo? I'm facing difficulty accessing the menu as it disappears immediately when I move my cursor away. (https://i.sstatic.net/ydqad.jpg) I've been searchin ...

Tips for validating form data in JavaScript before invoking a PHP file

When working with a form that has an action attribute to call another PHP page, I want to ensure that one text field is not empty by validating it with JavaScript before submission. How can I accomplish this using the <input type"submit"> tag? ...

Align all elements to the center and arrange them in a vertical column

I have implemented a form using Bootstrap 4 and here is the code: <link href="https://cdn.jsdelivr.net/npm/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="dcbeb3b3a8afa8aebdac9ce8f2eaf2ec">[email protected]</a&g ...

Can the recaptcha icon be customized with a new hue?

I have been attempting to alter the captcha icon/logo in recaptcha v2. Initially, I tried to modify it using regular CSS without success. Then, I experimented with jQuery to determine if the iframe had loaded completely before proceeding with the change. ...

Adjusting the background color of <tr> depending on the number of <tr> elements in the HTML using CSS

When working on my HTML page, I have utilized multiple <tr> tags with different bgcolor values such as: <tr bgcolor="#000000"> <tr bgcolor="#E5F1CC"> <tr bgcolor="#D30A0A"> <tr bgcolor="#656766"> I am aiming to assign unique ...