Pomoc w kodzie

pytanie zadane 3 października 2015 w HTML i CSS przez Paweł123 Nałogowiec (33,500 p.)

Cześć, mam problem :/ Chodzi o to, że meni nie układa się tak jak powinno. Chciałbym, aby wysztko było w jednej linii, jednak nie wiem jak to zrobić.

<! DOCTYPE HTML> 

<html>


    <head>
    
        <title>Strona głowna </title>
            
        <meta charset="utf-8"/>
        
        <link rel="stylesheet" href="tlo.css" tpye="text/css">
    
    
    </head>


    <body>
    
        <div id="logo">Nazwa strony</div>
        
        <div id="menu">
        
        <li>Strona główna</li>
        <li>Cele i Idee</li>
        <li><img src="Orange_girl_render.png" width="50" height="50"></li>
        <li>O nas</li>
        <li>Kontakt</li>
        
        
        
        
        
        </div>
        
        
        
        
    </body>

</html>

body
{
    background-color: gray;   
    margin-left: auto;
    margin-left: auto;
    margin: 0 !important;

}
#logo
{
    font-size: 50px;
    text-align: center;
    
    
}
#menu
{
    text-align: center;
   
   
        
    
}
li
{
    display: inline-block;
    font-size: 30px;
    background-color: aqua;
    padding: 2px;
    border-bottom-color: aquamarine;
    font-size: 40px;
    padding: 10px;
  
   
}
li:hover
{
    background-color: azure;   
    
    
}

Proszę o pomoc

5 odpowiedzi

odpowiedź 3 października 2015 przez Eimens Maniak (69,240 p.)

Widzę że nie rozumiesz tematu :) początkujący-rozumiem.

Proponuję zapoznać się ze stroną: http://kodcss.pl/kurs-css/lekcje/dzial-4/rozwijane-poziome-menu-css

Jeżeli już na wstępię robisz błędy to lepiej żebyś tego nie kończył, bo to będzie po prostu tandetne i błędnie zbudowane.

Jakiegoś czasu zbudowałem proste menu, które teraz ci pokażę LINK

Wszystkie elementy <li> powinny być w znaczniku <ul>

Czyli tak:

<ul>

</ul>

Dwa: czysty kod to podstawa nie rób zbędnych spacji, staraj się to trzymać w porządku.

ŹLE

{

display: inline-block;

font-size: 30px;

background-color: aqua;

padding: 2px;

border-bottom-color: aquamarine;

font-size: 40px;

padding: 10px;

}

DOBRZE:

li {

display: inline-block;

font-size: 30px;

background-color: aqua;

padding: 2px;

border-bottom-color: aquamarine;

font-size: 40px;

padding: 10px;

}

Robienie menu na samym początku nauki wcale nie jest proste, mam nadzieję że ogarniesz temat :) podałem wszystko co do tego potrzebne, teraz tylko wziąć się za lekturę :)

odpowiedź 3 października 2015 przez Schizohatter Nałogowiec (39,600 p.)

odpowiedź 3 października 2015 przez Patrycjerz Mędrzec (192,320 p.)

Gdzie ty masz tagi ul?

komentarz 3 października 2015 przez Patrycjerz Mędrzec (192,320 p.)

Ogólnie to obrazek rozpycha przycisk. Musisz sam sobie rozplanować, jaką będzie miał wielkość.

odpowiedź 3 października 2015 przez niezalogowany

Witaj,

daj

float:: left;

zamiast

display: inline-block;

komentarz 3 października 2015 przez writen Nałogowiec (29,060 p.)

Ale to niczego nie zmienia.

odpowiedź 3 października 2015 przez writen Nałogowiec (29,060 p.)

Robisz tak.

Wszystkie te li pakujesz do ul.

Co to za menu bez linków? Do li wsadzasz znacznik a.

Wszystkie właściwości z li, oprócz display, dajesz do a. Właściwości z li:hover dajesz do a:hover.

Ustalasz takie wymiary dla obrazka, aby ładnie pasował.

komentarz 3 października 2015 przez Paweł123 Nałogowiec (33,500 p.)

Nadal nie działa, nic się nie zmieniło :/

komentarz 3 października 2015 przez writen Nałogowiec (29,060 p.)

Kluczowym jest odpowiednie ustawienie wymiarów obrazka. Pewnie coś około 35px.

Błąd jest spowodowany różnicą wysokości tekstu i obrazka.

komentarz 3 października 2015 przez Paweł123 Nałogowiec (33,500 p.)

aha :D dzięki za podpowiedż :D

Podobne pytania

+1 głos

1 odpowiedź 447 wizyt

3 zdjęcia na sobie w HTML/CSS

pytanie zadane 28 maja 2021 w HTML i CSS przez Piotrek G Nowicjusz (160 p.)

+1 głos

2 odpowiedzi 363 wizyt

Zdjęcie i gradient

pytanie zadane 17 listopada 2020 w HTML i CSS przez Konrad M'k Nowicjusz (240 p.)

0 głosów

1 odpowiedź 209 wizyt

tekst i zdjęcie w bootstrapie

pytanie zadane 14 października 2020 w HTML i CSS przez napoludniestad.pl Użytkownik (960 p.)

Pomoc w kodzie

Zaloguj lub zarejestruj się, aby skomentować.

Zaloguj lub zarejestruj się, aby odpowiedzieć na to pytanie.

5 odpowiedzi

Zaloguj lub zarejestruj się, aby skomentować.

Zaloguj lub zarejestruj się, aby skomentować.

Zaloguj lub zarejestruj się, aby skomentować.

Zaloguj lub zarejestruj się, aby skomentować.

Zaloguj lub zarejestruj się, aby skomentować.

Podobne pytania

O działaniu forum

Pasja informatyki w internecie

Polecane miejsca w sieci