Länk-lista i IE blir jättetjock

IE6 vill gärna ha li med i css:en också. Kan tycka det är lite konstigt att du gjort allt i ul, men men... ska väl fungera också men som sagt inte i 6:an där default förmodligen visas nu.

Jag förstår inte riktigt hur du menar. Men lägger jag till

#sidebar li {line-height: 20px;}

så blir det ingen skillnad.

silfver skrev:

Jag förstår inte riktigt hur du menar. Men lägger jag till

#sidebar li {line-height: 20px;}

så blir det ingen skillnad.

Jag tror tanten menar att man vanligen formaterar listor i <li>. Inte i <ul>. Normalt har man listtypen i ul-taggen plus kanske nån grej mer, typ marginal eller så. Resten formaterar man i li-taggarna.

Danne V skrev:

Jag tror tanten menar att man vanligen formaterar listor i <li>. Inte i <ul>. Normalt har man listtypen i ul-taggen plus kanske nån grej mer, typ marginal eller så. Resten formaterar man i li-taggarna.

Okej, visst. Men den enda li-egenskapen jag lagt i ul-listan är ju list-style-type: none; och det spelar ingen roll vart den ligger. Det fungerar ändå inte i IE.

Inga tips på hur man kan slippa tjocka listor?

Den översta länken i alla ul-listor blir bra

Det här du skrev är lite förvirrande...
Låter som du har många listor, men länkarna som blir fel ligger väl ändå i li?
Om det är som jag tror du menar egentligen, så skulle jag gjort något liknande detta och så lägger jag till lite eftersom jag inte vad du har i resten av css, så bokstäverna blir ungefär lika stora i IE6 som i de andra.

Men en liten fundering... om det är så att det är många listor du har så skulle jag nog använt en Definitionslista i stället.

Men snabbt gjort, så det finns kanske något helt annat bättre egentligen men...

*{ margin: 0px; padding: 0px; }
* html #sidebar{font-size: 80%;}
    #sidebar{ float: right; margin: 10px 0; padding: 10px 0 0 10px; width: 178px; }
    #sidebar a,#sidebar a:active{ color: #690; display: block;  padding: 0.4em; text-decoration: none; }
    #sidebar a:hover{ background: #f0f0f0; }
    #sidebar li{ border-bottom: 0.1em solid #f0f0f0; color: #690; display: block; font: 0.7em/1; list-style: none; margin-left: 0px; text-align: left; }
    #sidebar ul{ border-top: 0.1em solid #f0f0f0; }

tanten skrev:

Det här du skrev är lite förvirrande...
Låter som du har många listor, men länkarna som blir fel ligger väl ändå i li?
Om det är som jag tror du menar egentligen, så skulle jag gjort något liknande detta och så lägger jag till lite eftersom jag inte vad du har i resten av css, så bokstäverna blir ungefär lika stora i IE6 som i de andra.

Men en liten fundering... om det är så att det är många listor du har så skulle jag nog använt en Definitionslista i stället.

Men snabbt gjort, så det finns kanske något helt annat bättre egentligen men...

*{ margin: 0px; padding: 0px; }
* html #sidebar{font-size: 80%;}
    #sidebar{ float: right; margin: 10px 0; padding: 10px 0 0 10px; width: 178px; }
    #sidebar a,#sidebar a:active{ color: #690; display: block;  padding: 0.4em; text-decoration: none; }
    #sidebar a:hover{ background: #f0f0f0; }
    #sidebar li{ border-bottom: 0.1em solid #f0f0f0; color: #690; display: block; font: 0.7em/1; list-style: none; margin-left: 0px; text-align: left; }
    #sidebar ul{ border-top: 0.1em solid #f0f0f0; }

Ta en titt på min sida så förstår du vad jag menar. Jag menar att de översta li-objekten i ul-menyn ser bra ut, men de som kommer efter blir inte alls bra.

Jag är lite osäker på din kod. Vill inte nollställa alla marginaler på sidan. Måste man göra såna enorma förändringar i koden för att det ska fungera?

Det jag såg nu ä att det är en typisk definitions-lista
<dl> istf <ul>
<dt> för alla dina <p><small>Sidor:</small></p>
<dd> för det som är <li> nu.
Om du ändrar det till ungefär som jag skrev i min css så kanske det fungerar utan 0-ningen...

Testa med det så blir det mycket tillgängligare dessutom.

Hinner inte mer nu... återkommer kanske i morgon.

Va lätt att testa eftersom du hade långa urler till allt :)
Jag testade

.black{ color: #000; }
#sidebar { float: right; margin: 10px 0; padding: 10px 0 0 10px; width: 178px; }
#sidebar a { color: #669900; display: block; padding: 15px 0px; text-decoration: none; }
#sidebar a:hover { background: #f0f0f0; }
#sidebar dd { border-bottom: 1px solid #f0f0f0; font-size: 0.7em; list-style-type: none; margin: 0; padding: 0; }
#sidebar dt { border-bottom: 1px solid #f0f0f0; color: #b5bac9; font-size: 0.7em; margin: 0px; padding: 5px 0; }

På dina två understa listor med

<dl>
<dt>V&auml;lj tema:</dt>
<dd><a href="http://www.silfvercreations.com/wordpress/index.php?wptheme=Bara+bakgrund">Bara bakgrund</a></dd>
<dd><a href="http://www.silfvercreations.com/wordpress/index.php?wptheme=Inramad">Inramad</a></dd>
</dl>

<dl>
<dt><span class="black">VD:n har ordet</span></dt>
<dd><a href="http://www.silfvercreations.com/wordpress/index.php?wptheme=WordPress+Classic">WordPress Classic</a></dd>
<dd><a href="http://www.silfvercreations.com/wordpress/index.php?wptheme=WordPress+Default">WordPress Default</a></dd>
</dl>

och det såg ut så här i IE6 med lite av dina ular kvar ovanför för jämförelse

Bytte bild

Det verkar ju onekligen fungera. :) Men problemet är att jag jobbar med Wordpress-teman och där loopas innehållet ut. Och det kan se ut till exempel så här:

<?php wp_get_archives('type=monthly'); ?>

Där kommer varje månad att listas som ett li-objekt och det kan jag inte göra något åt. :(

Så därför kan jag inte använda dt-listor.

Där ser man, använder inte wordpress och teman själv, men tycker det är konstigt att det inte går att ändra.
Men kika på css:en för dl och dd och se om du kan ändra i ul(dl) och li(dd) och se om du kan få samma effekt då.

tanten skrev:

Där ser man, använder inte wordpress och teman själv, men tycker det är konstigt att det inte går att ändra.
Men kika på css:en för dl och dd och se om du kan ändra i ul(dl) och li(dd) och se om du kan få samma effekt då.

Det går säkert att ändra, men då måste man gå in i byggfilerna och ändra och det är inte aktuellt tyvärr.

Men jag ska försöka trixa med din kod lite. Tack! :bire

Eftersom att jag vet att du och window och ie inte riktigt hör ihop så fixade jag med din lista i IE6 med att titta på din sida i FF då blev det. En bit på vägen kanske... ;)

#sidebar { float: right; margin: 10px 0; padding: 10px 0 0 10px; width: 178px; }
#sidebar a { color: #669900; display: block; padding: 8px 0; text-decoration: none; }
#sidebar a:hover { background: #f0f0f0; }
#sidebar li { border-bottom: 1px solid #f0f0f0; font-size: 0.8em; list-style-type: none; margin: 0; padding: 0; }
#sidebar ul { }/*ingenting*/

Min IE6 över och din sida bakom i FF på bilden

Blev tveksam till om det verkligen var din bakgrund jag screenshotade och tittade på men det är i så fall paddingen i a som skiljer... från din ursprungliga tror jag. Sorry, men hinner inte kolla mer, men det fixar väl du :-)

tanten, du är ju fantastisk! Nu verkar det fungera jättefint! Ändrade lite i din kod för att anpassa, men du gjorde det igen! (y) :bire