Izbornici

Muče me stalno ti izbornici, jel ima negdje o njima ali detaljno.

Kod horizontalnog izbornika(izbornik 1) kako da razmak između naslova ,O NAMA,PONUDA ,FOTOGRAFIJE,KAKO DO NAS,KONTAKT bude jednak.

Vertikalni izbornik(izbornik 2) u exploreru prikazuje točkasti rub a u operi i firefoxu prikazuje samo gornji točkasti rub.

Izbornik 1

HTML

		<div class="navigation">
		<ul>
  • O NAMA
  • PONUDA
  • FOTOGRAFIJE
  • KAKO DO NAS
  • KONTAKT
  • CSS

    #ispod_headera{
    position:relative;
    width:960px;
    height:28px;
    background:url(images/bg.jpg) no-repeat;

    }

    .navigation ul{
    list-style-type:none;
    margin:0;
    padding:0;
    float:left;
    }

    .navigation ul li{
    width:120px;
    height:22px;
    float:left;
    margin:5px 0 0 0 px;

    }

    .navigation ul li a{
    background-color:#679a3b;
    color:#FF;
    display:block;
    padding-left:10px;
    text-decoration:none;
    line-height:30px;
    width:100px;
    height:20px;
    margin:2px 0 0 20px;

    }

    .navigation ul li a :hover{
    background-color:#OFF;
    color:#09C;

    }

    Izbornik2

    HTML

    		<ul>
    
  • lorem
  • lorem
  • lorem
  • lorem
  • lorem
  • lorem
  • lorem
  • CSS

    .izbornik2{
    position:absolute;
    width:150px;
    margin:278px 0 0 35px;
    }

    .izbornik2 ul{
    width:150px;
    padding:0px;
    margin:0px;
    border:1px dotted;

    }

    .izbornik2 ul li a:link,a:visited{
    width:140px;
    height:20px;
    display:block;
    float:left;
    background:#595E23;
    padding-left:10px;
    }

    .izbornik2 ul li a:hover{
    background:#FFFFFF;
    color:#000000;
    text-decoration:none;

    }

    a:link,a:visited{
    font-family:,Arial,Helvetica,sans-serif;
    font-size:14px;
    color:#FFFFFF;
    text-decoration:none;
    font-weight:bold;
    }

    a:hover{
    text-decoration:none;
    }
    ul{
    list-style:none;
    }

    letter-spacing?

    Iako, meni isto izgledaju.

    Malo se sa Firebugom poigraj (iskljucuj i ukljucuj pojedine propertije CSS-a), pa ces vidit sta je problem.

    Meni IE8 isto prikazuje ko FF i Opera, trebao bi malo prouciti dokumentaciju kako funkcionira border za ul i li elemente.

    I btw, ispravi navodnike: “ -> "

    [quote=“igoo”]Vertikalni izbornik(izbornik 2) u exploreru prikazuje točkasti rub a u operi i firefoxu prikazuje samo gornji točkasti rub.
    [/quote]

    .izbornik2 ul{
    width:150px; 
    [B]position:absolute;[/B]
    padding:0px;
    margin:0px;
    border:1px dotted;
    
    }
    

    Dodaj
    position: absolute;
    Meni tako radi…

    Evo kako ja kôdiram horizontalni izbornik, možda ti pomogne.

    Uzet ćemo prvo HTML:

    [html]

    [/html]

    Recimo da želimo postići razmak između pojedinih elemenata liste, tu ćemo koristiti margine. A za redanje svega u jedan red, ja koristim display (ne volim float :D)

    CSS kôd:

    ul.izbornik {
        margin:0;
        padding:0;
    }
    ul.izbornik li {
        display:inline; // izmjenimo im defaultni display:block
        margin-right:20px; // razmak izmedu <li> elemenata
    }
    

    Sada tu još možemo uređivati linkove i tako:

    ul.izbornik li a {
        color:#000000;
        text-decoration:none;
    }
    ul.izbornik li a:hover {
        color:#666666;
        text-decoration:none;
    }
    

    Evo, tako da se izbjegne taj voljeni float.

    P.S.
    Sad sam se sjetio, ako želimo zadnjem maknuti desnu marginu jer bezveze zauzima prostor, možemo koristiti jednu pseudoklasu :last-child *

    ul.izbornik li:last-child {
        margin-right:0px;
    }
    

    Evo, možda bude korisno tebi ili nekom drugom.

    [size=4]* IE 6 ne zna za to, tako da pažljivo sa tim :)[/size]

    Zahvaljujem svima na odgovorima,za sada rješio problem (Vertikalni izbornik(izbornik 2) u exploreru prikazuje točkasti rub a u operi i firefoxu prikazuje samo gornji točkasti rub.)sa savjetom koji mi je dao Igog
    position:absolute;


    Copyright © 2020 WM Forum - AboutContact - Sponsored by: Mydataknox & Webmaster.Ninja