[HTML] lista ul i li, wstyd... Opcje

[Lejto]

Mam prosty kod listy ul

[HTML] pobierz, plaintext 
<ul style=" display:block;list-style:none;text-align:left">
  	<li>aaaaaa</li>
  </ul>
[HTML] pobierz, plaintext 

wszystko jest ok tylko wyświetla tak

(przerwa) aaaaaa
a ja chce żeby wyświetlało tak

aaaaa

bawiłem się już ze stylami ale nic nie mogę zrobić, czy już taki głupi jestem czy zapomniałem już jako to się robi...

[artur_dziocha]

display:block; chyba powinno byc w <li>

[Lejto]

zrobiłem tak i nadaj jest przerwa

[artur_dziocha]

ul {
margin: 0px;
padding: 0px;
}
li {
list-style-type: none;
display: block;
margin: 0px;
padding: 0px;
}

Ten post edytował artur_dziocha 31.12.2008, 11:33:09

[Lejto]

też nic

[Rudi1204]

a wrzuć to sobie do div'a np i sprawdz :]

[HTML] pobierz, plaintext 
<div style="width:50px; height:50px; background:red;>
<ul style=" display:block;list-style:none;text-align:left">
<li>aaaaaa</li>
</ul>
</div>
[HTML] pobierz, plaintext 

[Lejto]

@Rudi1204 zadziałało ale muszę to jeszcze do menu dodać, zobaczę czy będzie tak jak powinno

ok działa jak powinno

[HTML] pobierz, plaintext 
<div style="width:190px;">
	<span class="le"></span> 
	<span class="sr"> <p style="margin-top:2px">&raquo; Menu </p></span>
	<span class="pr">&nbsp;</span>  
 
<div style="width:190px; height:50px;>
 
<ul style="display:block;list-style:none; background-color:#FFF; border: 2px solid #cc9933;" id="sidelinks" class="arrowlistmenu" >
	    	<li><a href="index.php" id="glowna"><img src="images/arrowbullet.png" border="0">Strona główna</a> </li>
	    	 //
</ul>
    <span class="le_d"></span>
	<span class="sr_d"></span>
	<span class="pr_d"></span>
</div>
[HTML] pobierz, plaintext 

dobry kod?

[Rudi1204]

(IMG:http://forum.php.pl/style_emoticons/default/biggrin.gif)

[Lejto]

ale jeszcze chwila chwila (IMG:http://forum.php.pl/style_emoticons/default/tongue.gif)
jeszcze nie działa tak jak powinno

[HTML] pobierz, plaintext 
<div style="width:190px;">
<span class="le"></span>
<span class="sr"> <p style="margin-top:2px">&raquo; Menu </p></span>
<span class="pr">&nbsp;</span>
 
<div style="width:190px; height:50px;> <--------- tu nie ma na końcu " a jak dodam " to znów nie chodzi tak jak powinno 
 
<ul style="display:block;list-style:none; background-color:#FFF; border: 2px solid #cc9933;" id="sidelinks" class="arrowlistmenu" >
<li><a href="index.php" id="glowna"><img src="images/arrowbullet.png" border="0">Strona główna</a> </li>
//
</ul>
<span class="le_d"></span>
<span class="sr_d"></span>
<span class="pr_d"></span>
</div>
[HTML] pobierz, plaintext 

w tym divie nie mam na końcu " a jak dodam " to znów nie chodzi tak jak powinno (IMG:http://forum.php.pl/style_emoticons/default/sad.gif)

[Rudi1204]

[HTML] pobierz, plaintext 
<div style="width:190px; background:red;">
    <span class="le"></span>
    <span class="sr">
        <p style="margin-top:2px">&raquo; Menu</p>
    </span>
    <span class="pr">&nbsp;</span>
 
    <div style="width:190px; height:50px;>
 
        <ul style="display:block; list-style:none; background-color:#ffffff; border: 2px solid #cc9933;" id="sidelinks" class="arrowlistmenu" >
            <li><a href="index.php" id="glowna">
                    <img src="http://forum.php.pl/style_emoticons/default/biggrin.gif" style="border:0; width:20px; height:20px;">Strona główna
            </a></li>
        </ul>
 
        <span class="le_d"></span>
        <span class="sr_d"></span>
        <span class="pr_d"></span>
    </div>
</div>
[HTML] pobierz, plaintext 

nie bardzo wiem czy o to Tobie chodzi ale u mnie działa ok :]

Ten post edytował Rudi1204 31.12.2008, 12:08:30

[Lejto]

no działa tak jak wtedy ale chodzi o tego diva " <div style="width:190px; height:50px;> " nie ma na końcu style " a jak to się doda to znów lipa a bez tego jest ok. Rozumiesz?

[Rudi1204]

mistrzu mała uwaga nawet sam nie zauważyłem :/ zamiast

[HTML] pobierz, plaintext 
<div style="width:190px; height:50px;>
[HTML] pobierz, plaintext 

powinno być

[HTML] pobierz, plaintext 
<div style="width:190px; height:50px;">
[HTML] pobierz, plaintext 

widzisz różnice?? hehe pewnie nie więc napisze po 50px; nie miałeś apostrofa!! " ściągnij kod co ci wczesnieij napisałem dorzuć apostrof i będzie ok (IMG:http://forum.php.pl/style_emoticons/default/biggrin.gif)

Ten post edytował Rudi1204 31.12.2008, 12:17:56

[Lejto]

nauczycielu (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)
o tym " cały czas pisze jak to dodam to włśnie nie działa tak jak powinno a bez tego działa (IMG:http://forum.php.pl/style_emoticons/default/winksmiley.jpg)

[HTML] pobierz, plaintext 
<div style="width:190px; height:50px;>
[HTML] pobierz, plaintext 

działa

[HTML] pobierz, plaintext 
<div style="width:190px; height:50px;">
[HTML] pobierz, plaintext 

nie działa

div chyba nie pomoże chyba trzeba napisać jakiś styl do ul

Ten post edytował Lejto 31.12.2008, 12:21:29

[Rudi1204]

wklep sobie to i napisz co wyszło :]

[HTML] pobierz, plaintext 
<div style="width:190px; background:red;">
    <span class="le"></span>
    <span class="sr">
        <p style="margin-top:2px">&raquo; Menu</p>
    </span>
    <span class="pr">&nbsp;</span>
 
    <div style="width:190px; height:50px;">
 
        <ul style="display:block; list-style:none; background-color:#ffffff; border: 2px solid #cc9933;" id="sidelinks" class="arrowlistmenu" >
            <li><a href="index.php" id="glowna">
                    <img src="http://forum.php.pl/style_emoticons/default/biggrin.gif" style="border:0; width:20px; height:20px;">Strona główna
            </a></li>
        </ul>
 
        <span class="le_d"></span>
        <span class="sr_d"></span>
        <span class="pr_d"></span>
    </div>
</div>
[HTML] pobierz, plaintext 

[Lejto]

lipa tak jak na początku, jest przerwa

[Rudi1204]

i tak też działa ;pp

[HTML] pobierz, plaintext 
<div style="width:190px; background:red;">
    <span class="le"></span>
    <span class="sr">
        <p style="margin-top:2px">&raquo; Menu</p>
    </span>
    <span class="pr">&nbsp;</span>
 
 
        <ul style="display:block; list-style:none; background-color:#ffffff; border: 2px solid #cc9933;" id="sidelinks" class="arrowlistmenu" >
            <li><a href="index.php" id="glowna">
                    <img src="http://forum.php.pl/style_emoticons/default/biggrin.gif" style="border:0; width:20px; height:20px;">Strona główna
            </a></li>
        </ul>
 
        <span class="le_d"></span>
        <span class="sr_d"></span>
        <span class="pr_d"></span>
</div>
[HTML] pobierz, plaintext 

jakoś nie wiem dlaczego ale cieżko mi zrozumieć jaki chcesz uzyskać efekt ale może takie cos?? (IMG:http://forum.php.pl/style_emoticons/default/biggrin.gif) :D

[HTML] pobierz, plaintext 
<div style="width:190px; background:red;">
        <p style="margin-top:2px; margin-bottom:0">&raquo; Menu</p>
 
        <ul style="margin:0; display:block; list-style:none; background-color:#ffffff; border: 2px solid #cc9933;" id="sidelinks" class="arrowlistmenu" >
            <li><a href="index.php" id="glowna">
                    <img src="http://forum.php.pl/style_emoticons/default/biggrin.gif" style="border:0; width:20px; height:20px;">Strona główna
            </a></li>
            <li><a href="index.php" id="glowna">
                    <img src="http://forum.php.pl/style_emoticons/default/biggrin.gif" style="border:0; width:20px; height:20px;">Strona główna
            </a></li>
        </ul>
</div>
[HTML] pobierz, plaintext 

[Lejto]

a mi to nie działa (IMG:http://forum.php.pl/style_emoticons/default/tongue.gif) jest przerwa daj screena bo nie wierze (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)
html jest normalnie trudniejszy od php... (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)

[Rudi1204]

(IMG:http://rudi1204.w.interia.pl/01.jpg)

[Lejto]

no tak ale ja właśnie nie chce mieć tej przerwy (pusto) Strona główna
tak nie
(IMG:http://img166.imageshack.us/img166/8466/zal2rk4.gif)

tak chce
(IMG:http://img367.imageshack.us/img367/9762/zalof5.gif)

kumasz?

[Rudi1204]

kumam kumam ale teraz qrde nie bardzo mam czas :/ ale nie bede taki i pozostawiam linka moze pomoze :]
http://css.maxdesign.com.au/index.htm

a to tak zanim znikne :]

[HTML] pobierz, plaintext 
<div style="width:190px; background:red;">
        <p style="margin-top:2px; margin-bottom:0">&raquo; Menu</p>
 
        <ul style="margin:0; display:inline; list-style:none;" id="sidelinks" class="arrowlistmenu" >
            <li style="display:block;background-color:#ffffff; border: 2px solid #cc9933;"><a href="index.php" id="glowna">
                    <img src="http://forum.php.pl/style_emoticons/default/biggrin.gif" style="border:0; width:20px; height:20px;" alt="#" />Strona główna
            </a></li>
            <li style="display:block;background-color:#ffffff; border: 2px solid #cc9933;"><a href="index.php" id="nastepna">
                    <img src="http://forum.php.pl/style_emoticons/default/biggrin.gif" style="border:0; width:20px; height:20px;" alt="#" />Strona główna
            </a></li>
        </ul>
</div>
[HTML] pobierz, plaintext 

[Lion_87]

a margin, padding??

[HTML] pobierz, plaintext 
<style>
ul, ul li {
	display: block;
	list-style: none;
	margin: 0;
	padding: 0;
}
</style>
 
<div style="width:190px; background:red;">
<span class="le"></span>
<span class="sr">
<p style="margin-top:2px">&raquo; Menu</p>
</span>
<span class="pr">&nbsp;</span>
 
<div style="width:190px; height:50px;">
 
<ul id="sidelinks" class="arrowlistmenu" >
<li><a href="index.php" id="glowna">
<img src="http://forum.php.pl/style_emoticons/default/biggrin.gif" style="border:0; width:20px; height:20px;">Strona główna
</a></li>
</ul>
 
<span class="le_d"></span>
<span class="sr_d"></span>
<span class="pr_d"></span>
</div>
</div>
[HTML] pobierz, plaintext 

[piotrooo89]

ja wyskrobałem coś takiego:

[HTML] pobierz, plaintext 
<style type="text/css">
ul
{
	list-style: none;
	display: inline;
}
li
{
	display: block;
}
</style>
Menu
<ul>
	<li>Memu1</li>
	<li>Memu1</li>
</ul>
[HTML] pobierz, plaintext 

[Lejto]

@Rudi1204, działa ale
powstała przerwa przez display:inline;
(IMG:http://img367.imageshack.us/img367/28/zalplwe1.gif)
zobacze jeszcze twoje @piotrooo89 i @Lion_87

Ten post edytował Lejto 31.12.2008, 13:17:13

[piotrooo89]

pokaż jak to robisz... kod.

[Lejto]

całość + Rudi1204

[HTML] pobierz, plaintext 
<style>
.le{background: url('images/lewo.gif');background-repeat: no-repeat;width: 15px;height: 23px;float: left;}
.sr{background: url('images/srodek.gif'); background-repeat:repeat; width:160px; height:23px; float:left;}
.sr{font-size:12px; font-weight:bold; vertical-align:bottom;}
.pr{background: url('images/prawo.gif'); background-repeat: no-repeat; width:15px; height:23px; float: right;}
 
 
.le_d{background: url('images/border-l.gif');background-repeat: no-repeat; width: 12px; height: 10px;float: left;}
.sr_d{background-image : url('images/border-c.gif');background-repeat:repeat; height:10px; width:163px; float: left;}
.pr_d{background-image : url('images/border-r.gif');background-repeat: no-repeat; width:15px; height:23px; float: right;}
 
</style>
 
<div style="width:190px;">
	<span class="le"></span> 
	<span class="sr"> <p style="margin-top:2px">&raquo; Menu </p></span>
	<span class="pr">&nbsp;</span>  
 
 
<ul style="margin:0; display:inline; list-style:none;" id="sidelinks" class="arrowlistmenu" >
	    	<li><a href="index.php" id="glowna"><img src="images/arrowbullet.png" border="0">Strona główna</a> </li>
	    	 <li><a href='?co=ksiegaw' id="ksiega"><img src="images/arrowbullet.png" border="0">  Księga gości</a>   </li>
 
</ul>
     <span class="le_d"></span>
	<span class="sr_d"></span>
	<span class="pr_d"></span>
</div>
[HTML] pobierz, plaintext 

[kazag]

aaa widzisz, a daj linkom w <li> margin-left:0px;
miałem ten sam problem.

btw. list-style:none; daje się do ul czy li?

[erix]

Kod

<span class="sr"> <p style="margin-top:2px">&raquo; Menu </p></span>

Daj dla .sr styl overflow: hidden.

[Lejto]

to w końcu co z tego kodu wywalić a co dodać? bo już sam nie wiem margines ustawiłem na 0px....

[erix]

Przecież podałem, co zmienić, aby nie robiło przerwy.

[Lejto]

nic nie pomogło

[erix]

Pokaż, co zmieniłeś.

[Lejto]

mam tak:

[HTML] pobierz, plaintext 
<style>
.le{background: url('images/lewo.gif');background-repeat: no-repeat;width: 15px;height: 23px;float: left;overflow:hidden;}
.sr{background: url('images/srodek.gif'); background-repeat:repeat;overflow:hidden; width:160px; height:23px; float:left;overflow:hidden;}
.sr{font-size:12px; font-weight:bold; vertical-align:bottom; overflow:hidden;}
.pr{background: url('images/prawo.gif'); background-repeat: no-repeat; width:15px; height:23px; float: right;overflow:hidden;}
 
 
.le_d{background: url('images/border-l.gif');background-repeat: no-repeat; width: 12px; height: 10px;float: left;}
.sr_d{background-image : url('images/border-c.gif');background-repeat:repeat; height:10px; width:163px; float: left;}
.pr_d{background-image : url('images/border-r.gif');background-repeat: no-repeat; width:15px; height:23px; float: right;}
 
</style>
 
 
<div style="width:190px;">
	<span class="le"></span> 
	<span class="sr"> <p style="margin-top:2px">&raquo; Menu </p></span>
	<span class="pr">&nbsp;</span>  
 
 
<ul style="margin-left:0px;  display: inline; list-style:none;" id="sidelinks" class="arrowlistmenu" >
	    	<li><a href="index.php" id="glowna"><img src="images/arrowbullet.png" border="0">Strona główna</a> </li>
	    	 <li><a href='?co=ksiegaw' id="ksiega"><img src="images/arrowbullet.png" border="0">  Księga gości</a>   </li>
 
</ul>
     <span class="le_d"></span>
	<span class="sr_d"></span>
	<span class="pr_d"></span>
</div>
[HTML] pobierz, plaintext 

wszystko jest ok tylko są te odstępy jak pokazałem na screenie

[Lion_87]

daj do stylu <p>

Kod

padding: 0;margin: 0;

[Lejto]

nic nie dało, przecież <p> i jego styl należy do "Menu"

[Lion_87]

to może skasuj w ul styl i daj w <style>

Kod

ul, ul li {
display: block;
list-style: none;
margin: 0;
padding: 0;
}

[Lejto]

działa (IMG:http://forum.php.pl/style_emoticons/default/smile.gif) dzięki, wydaje mi się że już tak robiłem, ale tyle z tym mieszałem...