The @import CSS at-rule is used to import style rules from other style sheets.
Questions tagged [css-import]
31 questions
314
votes
14 answers
How to import Google Web Font in CSS file?
I'm working with a CMS which I only have access to the CSS file. So, I can't include anything in the of the document. I was wondering if there was a way to import the web font from within the CSS file?

David
- 4,717
- 8
- 35
- 46
25
votes
9 answers
react-slick: Import CSS from slick-carousel fails
React beginner here. My app uses create-react-app, and I'm pulling in react-slick for a carousel. I'm trying to follow the directions that are provided in the setup for react-slick, but the following doesn't work for me:
@import…

flysi3000
- 395
- 1
- 4
- 9
13
votes
5 answers
How to import external css file in nextjs app
I am working on react based nextjs app. Some npm packages are using external css import.
I am getting error like
Module parse failed, you may need an appropriate loader to handle this file type.
How can I support css import from external packages…

Mira Thakkar
- 339
- 1
- 6
- 19
5
votes
1 answer
How to use Material Design Icons in a web component?
Looks like that mdi is not working inside web components, or do I miss something?
I want to develop a web component that encapsulates it's dependencies, adding the link to the parent document works, but it violates the original…

Jamesgt
- 565
- 5
- 17
4
votes
0 answers
Performance of CSS @import with layers vs. link
Assuming there are no internal embeds within the CSS files, is there any performance drawback using CSS layers and @import vs. in the following server-side-rendered scenario:
Using :

Dan
- 5,836
- 22
- 86
- 140
4
votes
1 answer
Laravel - Add custom styling to the existing app.scss
I'm new to Laravel and I've read a few other questions on Stackoverflow about adding custom styling to Laravel.
The reason I'm creating a new stackoverflow question is because Laravel seems to compile a single app.css, that also loads bootstrap. I…

Charles Lindbergh McGill
- 83
- 1
- 9
4
votes
1 answer
Is that possible to use css variable in css "background url"
I would like to set a base domain with all of my pictures in CSS file, here's what I tried:
global.css
:root
{
--bgd: #C0C0C0;
--picdomain: "https://somedomain.com/";
}
s1.css
@import url("global.css");
body
{
background-color: var(--bgd);…

RRTW
- 3,160
- 1
- 35
- 54
3
votes
1 answer
How does the code in App.css gets included when exporting default App?
I am new to react (Javascript as well), I got this doubt reagarding the output when rendering the React Component-> App of the template code generated using 'create-react-app'.
Here is the App.js:
import React from "react";
import…

noobron
- 41
- 1
- 8
3
votes
1 answer
Block page rendering for @import CSS
TLDR; skip to the problem section
Background
We have a very large monolith legacy application. We are in the process of stripping functionality out into a new application.
These two applications have vastly different UI's built in vastly different…

ste2425
- 4,656
- 2
- 22
- 37
3
votes
0 answers
Jekyll - Recommended way of importing files
In my recent efforts to understand, maintain & add features to an existing website, built with Jekyll, I have posted a few questions (see this & this).
I have added a js slider plugin on the home page. The CSS file that came with the slider was…

Kayote
- 14,579
- 25
- 85
- 144
1
vote
1 answer
Why can't i use imported css class in html?
I have an Angular project and created a custom theme with material theme creator. From the creator, I got 6 CSS files. In one of them, there are a lot of CSS variables created and in another it creates classes that use those CSS variables. Here is…

Sidereus
- 200
- 3
- 13
1
vote
1 answer
stylings work even without importing css file in JS files
I have a create-react-app project. In src folder, I import index.css into index.js file to style globally. Besides that, I also have multiple css files for each route. But my concern is the stylings in other css files work even though I don't import…

Thi Nguyen
- 49
- 2
- 6
1
vote
3 answers
Background color overridden even after reversing the order of CSS layers
I want to use the new CSS cascade layers feature supported by latest versions of Chrome, Firefox, Safari, and Edge (see the support table).
I'm importing a stylesheet from highlight.js.
It has a class named hljs that applies a background color to…

Mahozad
- 18,032
- 13
- 118
- 133
1
vote
1 answer
Why can't I target my custom-defined HTML elements in CSS?
In my HTML, I've got:
...
In custom.js, say I've defined:
class Custom extends HTMLElement {
connectedCallback() {
const shadow =…

Antrikshy
- 2,918
- 4
- 31
- 65
1
vote
0 answers
How to get Node.js to accept css imports?
Is there any known way to get Node.js to accept css imports when running javascript files?
More specifically, is there a known way to get a React app (that imports css files to render pages) to run on a node.js server to render the app to a string…

Mr.Drew
- 939
- 2
- 9
- 30