The integration of CSS into Laravel was unsuccessful

Below is the content of my index file located in views.admin:

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <link rel="stylesheet" href="css/admin/style.css">

    <title>title</title>
</head>

And here is another file also situated in views.admin:

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css/admin/style.css">

    <title>title</title>
</head>

The index file is functioning correctly, but the other file is not applying the css styles.

Additionally, the css file can be found at 'public/css/admin/style.css'

csslaravel

Answer №1

Here is a helpful tip for linking your style or script from the public folder:

{{ asset('css/admin/style.css') }}

If you encounter issues, make sure not to include the public/ folder in the path. You can solve this problem by adding the following line to your .env file:

ASSET_URL = public/

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

Trouble displaying CSS content image in Internet Explorer

Usually, I use Chrome as my default browser. However, I recently decided to test whether my website functions properly on other browsers as well. In Chrome, the header displays my logo with great quality using content:url. But when I tried accessing my w ...

cssinternet-explorergoogle-chrome

Working with Laravel 5 and utilizing a pivot table in conjunction with a hasMany relationship

I am in the process of developing a polling system that involves two main tables: The polls table which includes fields such as id, question, created_at, updated_at. The choices table with fields like id, poll_id, choice. In addition to these tables ...

phpmysqllaravellaravel-5eloquent

I am trying to collapse the table header but I am having trouble doing so

@import url(https://fonts.googleapis.com/css?family=Roboto:400,500,700,300,100); @import url(https://fonts.googleapis.com/css?family=Roboto:400,500,700,300,100); body { bac ...

javascripthtmlcssbootstrap-4html-table

How to style material-ui input with outlined variant using css

Currently, I am attempting to replicate the material-ui outlined input. The background color and input styles are different, so simply setting the label position to absolute and pushing it up is not working for me. Any suggestions on how to achieve this? ...

cssreact-nativematerial-ui

What is the best way to incorporate Blade code into a React component within a Blade view file?

Recently, I've been working on a Laravel view named homepage.blade.php, which includes the following code: <body> <div id=root></div> <script src="./js/app.js"></script> </body> In the app.js file: ...

phphtmlreactjslaravellaravel-blade

Placing a Div wrapper around the contents of two corresponding elements

I am currently attempting to wrap a div with the class name 'wrapped' around two other divs containing innerHTML of 'one' and 'two'. <div class='blk'>one</div> <div class='blk'>two</di ...

javascriptjqueryhtmlcss

Challenger arises in the realm of Chakra UI styling

Recently, I've encountered an issue with displaying a card using chakra UI and next js. The CSS of chakra UI seems to be messed up, causing all my components to display incorrectly. It was working perfectly fine until yesterday. I tried deleting the . ...

cssnext.jsfrontendchakra-ui

purge mysql using laravel

I'm having an issue with deleting information from the database using a submission post. The information is being updated instead of deleted. Route: Route::get('/home', 'HomeController@index')->name('home'); Route::p ...

phpsqllaravelsql-deleteinformation-schema

An image overlaying a background design featuring a navigation bar and company logo

Is there a way to stack images on a background image similar to this using HTML? There is also a navbar and logo on the background. I attempted to do something like this: //clearfix .image-stack::after { content: ' '; display: table; clear ...

htmlcsssass

JavaScript layout: Thymealf

I have a unique thymeleaf template like so: <body> <div id="layout"> <!-- Menu toggle --> <a href="#menu" id="menuLink" class="menu-link"> <!-- Hamburger icon --> <span>& ...

javascriptcsshtmlthymeleaf

Tips for making rounded corners with CSS styling

Can someone help me create a border like the one shown in this image? https://i.stack.imgur.com/b0GIa.png .child::before { content: ""; position: absolute; width: 13px; height: 13px; left: -1px; background: transparent; border-bott ...

htmlcss

Modify the scrollbar's width, color, and corner radius to customize its appearance

Here is the table code where the styles are applied. By setting the tablecontainer height to 600px, we can make the table scrollable. However, I would like to customize the scrollbar with a different color, width, and corner radius. <TableContainer s ...

cssreactjshtml-tablematerial-ui

Minifying HTML, CSS, and JS files

Are there any tools or suites that can minify HTML, JavaScript, and CSS all at once? Ideally, these tools should be able to: Identify links from the HTML document and minify the associated JavaScript and CSS. Remove any unused JavaScript functions and CS ...

javascripthtmlcssminify

The Laravel API documentation in Swagger cannot be located

I'm currently working on integrating Swagger into my Laravel project. After installing it, I ran the following command: composer require "darkaonline/l5-swagger:5.6.*" However, when I try to access http://127.0.0.1:8000/api/documentation ...

phplaravelswagger

Gatsby's build process encounters a stumbling block when webpack fails due to issues

Every time I try to run gatsby build, an error pops up: failed Building static HTML for pages - 10.179s ERROR #95313 Building static HTML failed Refer to our documentation page for more details on this issue: https://gatsby.dev/debug-html 343 | ...

cssreactjswebpackgatsbystylish

What is the best way to arrange these badges in a row?

I'm struggling to horizontally align these badges next to each other, as inline-block isn't working and they keep stacking vertically instead of side by side. How can I achieve the alignment shown in the image below? This is the desired appeara ...

htmlcsstwitter-bootstrapbootstrap-5

Using Vue.js for redirecting with a post method

Is there a way to redirect from Vue.js to a Laravel controller using the POST method without using AJAX? I would like to be able to use var_dump or dd inside the controller. //Vue.js axios.post('/add-hotel-listing', this.finish).then((respons ...

javascriptnode.jslaravelvue.jsvuejs2

Controller for Ionic 3 styles and loading animations

What is the best way to eliminate these white spaces in our fullscreen mode? View the image here removeWhiteSpace() { let space = document.getElementById('white-space'); if (space) { space.style.display = 'none'; ...

cssionic-frameworkionic2ionic3

Extracting Text from a Span Element Using XPath in Selenium

Here is the HTML code snippet: <div class="a-row a-spacing-small a-size-small"> <div class="a-row"> <a class="a-link-normal a-declarative g-visible-js reviewStarsPopoverLink" href="#" data-action="a-popover" data-a-popover="{"closeButton":" ...

javacssseleniumxpath

What is the best way to ensure that only one accordion tab remains open at a time, preventing it from closing unless a different tab

How can I ensure that only one accordion tab is open at a time, automatically closing any others that are currently open? Here is my current code for the accordion: $('[data-bs-toggle="collapse"]').on('click', function(e) { if ($( ...

javascriptjquerycssbootstrap-5