Horizontalni izbornik

Jel netko zna ?

Želim da mi izbornik1 bude horizontalan ali nikako ne uspijevam.Šaljem HTML i CSS pa ako netko zna u čemu je problem bio bih mu zahvalan.

[html]

vjezba 2
<div id ="omotac_unutarnji">
	<div id="zaglavlje">
	<h1>Stranica u izradi</h1>
	
	
	</div>	
		<div id="sadrzaj">
		<div id="izbornik1">
		<div id="navigation">
		<ul>
  • O nama
  • Ponuda
  • Fotografije
  • Kako do nas
  • Kontakt
  • 		<div id="lijevo">
    		
    		
    		<div id="slika_sova">
    		<img src="images/sova.gif" width="130" height="98"/>
    		</div>
    		
    		
    		
    		<div class="izbornik2">
    		
    		<ul>
    
  • lorem
  • lorem
  • lorem
  • lorem
  • lorem
  •    <div id="srednji">
       
       <div class="slika_kuca">
    		<img src="images/kuca.jpg" width="142" height="107"alt="stara lonja"/>
    		</div>
       
       <div class="slika_kuca2">
    		<img src="images/kuca_2.jpg" width="198" height="149"alt="stara lonja"/>
    		</div>
    
       <h2>lorem</h2>
      
       <div id="text_sredina">
       <p>lorem
    

    lorem

       </div>
    
    		<div id="desno">
    		
    		
    		<h3>Izleti</h3>
    		<div id="izleti">
    		<p>lorem</p>
    		<p>lorem</p>
    		<p>lorem</p>
    		<p>lorem</p>
    		<p>lorem</p>
    		<p>lorem</p>
    		<p>lorem</p>
    		<p>lorem</p>
    		
    		</div>
    		</div>
    
    (C)lorem

    CSS

    body
    {
    background:#a7b589;
    }
    {margin: 0; padding: 0;}
    /
    -------------------------------------------tijelo---------------------------------------/
    h1{
    font-family:Arial,Helvetica,sans-serif;
    font-size:24px;
    color:#FFFFFF;
    margin:0px 0 0 10px;
    }
    /
    -------------------------------------------omotači---------------------------------------*/
    #omotac{
    width:970px;
    height:1010px;
    margin-top:0px;
    margin-left:auto;
    margin-right:auto;
    padding:0px;
    border:2px dotted black;
    background:#817C4C;
    overflow:hidden;
    }

    #omotac_unutarnji{
    float:left;
    margin:5px;
    width:960px;
    height:1000px;
    background:#ffffff;
    }

    #zaglavlje{
    position:relative;
    width:960px;
    height:150px;
    background:url(images/headera.jpg) no-repeat;
    }

    #sadrzaj{
    float:left;
    width:960px;
    height:1000px;
    }
    /------------------------------------izbornik1---------------------------/
    #izbornik1{
    position:relative;
    width:960px;
    height:20px;
    float:left;
    margin:0px;
    }

    #navigation{

    width:200px;

    }

    #navigation ul{
    width:200px;
    padding:0px;
    margin:0px;
    }

    #navigation ul li a:link,a:visited{
    width:100px;
    height:20px;
    display:block;
    background:#000000;
    padding-left:10px;
    float:left;
    }

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

    /-------------------------------------------lijevistupac---------------------------------------/
    #lijevo{
    width:316px;
    height:773px;
    float:left;
    margin-left:0px;
    margin-top:0px;
    background:#679a3b;

    }

    #slika_sova{
    position:absolute;
    width:130px;
    height: 98px;
    margin:232px 0 0 35px;
    background: url(images/sova.gif) no-repeat;
    }

    /-------------------------------------------izbornik2---------------------------------------/
    .izbornik2{
    position:absolute;
    width:150px;
    float:left;
    margin:330px 0 0 35px;
    }

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

    .izbornik2 ul li a:link,a:visited{
    width:140px;
    height:20px;
    display:block;
    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:12;
    color:#FFFFFF;
    text-decoration:none;
    font-weight:bold;
    }

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

    /-------------------------------------------srednjistupac---------------------------------------/

    #srednji{
    width:316px;
    height:773px;
    float:left;
    margin-left:1px;
    background:#679a3b;
    }

    .slika_kuca{
    position:absolute;
    background-image:url(images/kuca.jpg);
    width:142px;
    height: 107px;
    margin:50px 0 0 85px;
    border:2px double #d2d0d8;

    }

    .slika_kuca2{
    position:absolute;
    background-image:url(images/.jpg);
    width:198px;
    height: 149px;
    margin:315px 0 0 55px;
    border:2px double #d2d0d8;

    }
    #text_sredina{
    position:absolute;
    width:305px;
    margin:180px 0 0 5px;
    text-align:justify;
    font-family:Arial,Helvetica,sans-serif;
    font-size:14px;
    color:#23430a;
    }

    #text_sredina2{
    position:absolute;
    width:305px;
    margin:480px 0 0 5px;
    text-align:justify;
    font-family:Arial,Helvetica,sans-serif;
    font-size:14px;
    color:#23430a;
    }

    h2{
    position:absolute;
    font-family:Arial,Helvetica,sans-serif;
    font-size:12px;
    color:#FFFFFF;
    text-decoration:none;
    margin:600px 0 0 70px;

    }

    /-------------------------------------------srednjistupac---------------------------------------/

    /-------------------------------------------desnistupac---------------------------------------/

    #desno{
    width:316px;
    height:773px;
    float:left;
    margin-left:1px;
    margin-right:0px;
    padding:0 5px 0 5px;
    background:#679a3b;
    }
    h3 {
    position:absolute;
    font-family:Arial, Helvetica, sans-serif;
    font-size: 18px;
    color: #FFFFFF;
    text-decoration:none;
    margin:30px 0 0 120px;
    }

    #izleti{
    position:absolute;
    font-family:Arial,Helvetica,sans-serif;
    font-size:14px;
    color:#23430a;
    margin:60px 0 0 105px;
    line-height:1.5;
    }

    /-------------------------------------------podnožje---------------------------------------/
    #podnozje{
    clear:both;
    width:960x;
    height:57px;
    background:#23430a;
    margin-top:0px;
    margin-left:0px;
    margin-right:0px;
    }
    .text{
    float:left;
    margin:40px 0px 0px 363px;
    font-size:15px;
    font-style:italic;
    }[/html]

    Dodaj float:left; na li i makni display:block; …

    Napravio sam ovo što mi je rekao xyxasilixyx ali ništa se nije dogodilo.Trenutno to izgleda tako da vidim izbornik ali je on u vertikalnom položaju smješten ispod headera (koji je na vrhu)lijevo u lijevom kutu ispod headera.

    Makni sa ul ‘width:200px’ i sa li makni ‘width:100px’ …

    Da bi ti proradilo prvo trebaš izbrisati width: 200px; iz #navigation, a zatim u #navigation ul {} dodati komandu: display: inline;.

    btw. stranica ti je skroz poremecena u firefox-u, pobrini se za to…


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