Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

364
Vistas
Css style do not work in React , using Webpack for css-loader

I try to style my React component using an local file Css and a css-loader webpack , all libraries are up to date! No error show it cmd , when I try to run npm , or in console in localhost:8000, in browser. Code webpack:

module.exports = {
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader"
        }
      },
      {
        test: /\.css$/i,
        use: ["style-loader", "css-loader"],
      },
      {
        test: /\.(png|jpe?g|gif)$/i,
        use: [
          {
            loader: 'file-loader',
          },
        ],
      },
    ],
    
  },
};

css-file:

.muzee img{
    width                   : 60px;
    animation               : muzee 7s linear infinite;
}

.muzee {
    width                   : 100%;
    display                 : flex;
    color:black;
    background-color        :black;
    align-items             : center;
    justify-content         : space-around;
    position                : absolute;
    bottom                  : -70px;
}

React file:

import React, { Component } from 'react'
import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import { addLead } from '../../actions/leads';
import { Leads } from './Leads';
import './style.css'
import img from "./images/logoul.png";

//THE LAST OPTION :*(
/*(const muzee ={
      width                   : '100%',
    display                 : 'flex',
    color                   :'black',
    background_color        :'black',
    align_items             : 'center',
    justify_content         : 'space_around',
    position                : 'absolute',
    bottom                  : '-70px',
}
*/

export class MainPage extends Component {
      
            render() {
                  
                  return (
                        <div>
                        <div className='muzee'>
                        <img src={img}/>
                        <img src={img}/>
                        <img src={img}/>
                        <img src={img}/>
                        <img src={img}/>
                        <img src={img}/>
                        <img src={img}/>
                    </div>  
                       </div>
                  )
            }
      }

For me , this type of project is kinda new , so I really do not understand very well how this problem occur. Or please give me some info where I can see more about this task.Thx!

about 4 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda