Entrar ¿Aún no tienes acceso?
16
respuestas

[Duda] Atomic Desing

Referente al curso Arquitectura CSS: descomplicando los problemas, en el capítulo Estilizando sección Banner y Sobre y actividad Atomic Design

por Estudiante
| 56.7k xp | 20 posts

Al realizar el AD como en esta clasie de me desconfiguro la pag.web la utilizamos paraa ver el trabajo. Alguen me podra decir en que me equivoque ?

<title>Fruta & Fruto</title>
    <link href="https://fonts.googleapis.com/css?family=Pacifico|Roboto:100,300,400,500,700,900" rel="stylesheet" />
    <link href="./assets/css/normalize.css" rel="stylesheet" />
    <link href="./assets/css/reset.css" rel="stylesheet" />
    <link rel= "stylesheet" href="/assets/css/cabecera.css">
    <link rel= "stylesheet" href="/assets/css/menu/menu-lista.css">
    <link rel= "stylesheet" href="/assets/css/menu/menu-item.css">
    <link rel= "stylesheet" href="/assets/css/menu/menu-link.css">
16 respuestas
por Estudiante
| 56.7k xp | 20 posts

Sigue funcionando este foro ???

por Mannelys De Los Angeles
| 79.1k xp | 12 posts

hola pudiste resolver , mepaso igual se me desconfiguro todo.. hice exactamente lo de la profe :(

por Estudiante
| 56.7k xp | 20 posts

Hola ,no lamentablemente no lo consulte tambien en el Discord pero las respuestas no funcionaron. Si podes solucionarlo avisame.

Salidos

por Mannelys De Los Angeles
| 79.1k xp | 12 posts

asi fue como me funciono a mi, colocandole el punto antes de la barra ./ tambien tuve que verificar si estaban escrito igual la class en el css y en el html y encontre que me habia equivocado en los nombres..

   <link href="./assets/css/cabecera.css" rel="stylesheet"/>
    <link rel= "stylesheet" href="./assets/css/menu/menu-lista.css">
    <link rel= "stylesheet" href="./assets/css/menu/menu-item.css">
    <link rel= "stylesheet" href="./assets/css/menu/menu-link.css">
por Estudiante
| 56.7k xp | 20 posts

Muchas Gracias

por Estudiante
| 56.7k xp | 20 posts
 <link  href="./assets/css/cabecera.css" rel="stylesheet"/>
    <link rel="stylesheet" href="./assets/css/menu/menu-lista.css">
    <link rel="stylesheet" href="./assets/css/menu/menu-item.css">
    <link rel="stylesheet" href="./assets/css/menu/menu-link.css">

Me queda asi.

Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad

por Mannelys De Los Angeles
| 79.1k xp | 12 posts
</head>
    <body>
      <header class="cabecera">
        <img class="logo-img" src="./assets/img/logo.jpg" alt="frutayfruto">
        <nav class="menu">
            <ul class="menu__lista">
                <li class="menu__item"><a class="menu__link activo" href="">Inicio</a></li>
                <li class="menu__item"><a class="menu__link" href="">Recetas</a></li>
                <li class="menu__item"><a class="menu__link" href="">Quienes Somos</a></li>
                <li class="menu__item"><a class="menu__link" href="">Contacto</a></li>
            </ul>
        </nav>
      </header>
      <section class="banner">
        <img src="./assets/img/banner.png" alt="banner">

      </section>
    </body>
</html>

recuerda colocarle los dos guiones en el css tambien,

Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad

por Estudiante
| 56.7k xp | 20 posts

Si con la medologia BEM me quedaba bien ,pero al pasar al AD no me queda igual (ya borrando el style.css como dice la profesora) y separando la cabecera y los menu.

por Mannelys De Los Angeles
| 79.1k xp | 12 posts

yo tambien hice lo del AD y el problema estaba en uno de los nombres lo tenia mal escrito o sea no estaba igual que la class y al corregir ese error listo.. si lo deseas pasame el codigo de los menu y la cabecera para ver , suele pasar que uno de tanta frustracion buscando el error no lo mira jeje.. me ha pasado muchisimo.. en el menu-item y menu-lista debes tener el problema por estar mal escrito o la ruta

por Estudiante
| 56.7k xp | 20 posts

Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad

por Estudiante
| 56.7k xp | 20 posts

Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad

por Mannelys De Los Angeles
| 79.1k xp | 12 posts

esta todo bien lo compare con mi codigo .. lo unico es que los styles de cabecera, menu-list y menu-item debes guardar los cambios

por Laura Sofía Silva Nieto
| 79k xp | 2 posts

Hola compañero, me pasó lo mismo que a ti. Revisé y comparé todo el código y, según yo, estaba exactamente igual al del video.

Mi solución fue eliminar el archivo menu-item y el contenido lo agregué al archivo menu-link.

Espero también te funcione.

Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad

por Estudiante
| 56.7k xp | 20 posts

Gacias por la info

por Estudiante
| 61.3k xp | 15 posts

Hola! a mi me pasaba lo mismo que a vos, al aplicar el Atomic Design (separando los archivos del menu) se perdía la propiedad Display: flex de las secciones de la barra de navegación quedado nuevamente como una lista. Lo que hice fue colocar menu_lista y menu__item en un mismo archivo CSS y así nuevamente se aplicó la propiedad flex. Espero sea de ayuda. Saludos!

por Estudiante
| 56.7k xp | 20 posts

Gracias