Notifikationer

Markér alle som læst Log ud

Slettet bruger

08. juni 2005 - 17:15 Der er 6 kommentarer og
2 løsninger

Ændre linjehøjde på linje med både tekst og billede

Hej

Jeg har en menu på min hjemmeside.

Menupunkt 1
Menupunkt 2
Menupunkt 3

Foran hvert menupunkt er der en lille bullet.

Jeg vil gerne have lidt mere afstand mellem linierne og har prøvet med "line-height: 20px" men der er overhovedet ingen respons.

Fjerner jeg billedet fra linjen, virker det fint.

Hvad skal jeg gøre?

Det er ikke muligt at bruge ul eller ol da farven på bullet'en ændrer sig alt efter hvilken side brugeren er på (altså viser en markering af hvilken underside brugeren er på...).

Synes godt om

nielle Nybegynder

08. juni 2005 - 18:23 #1

Rent faktisk kan du sagtens bruge grafiske bullets sammen med <ul>:

http://www.w3schools.com/css/tryit.asp?filename=trycss_list-style-image

http://www.w3schools.com/css/css_list.asp

Synes godt om

olebole Juniormester

08. juni 2005 - 21:05 #2

<ole>

Hvad du skal gøre anderledes er svært at sige, da vi ikke kan se, hvad du gør nu :)

/mvh
</bole>

Synes godt om

Slettet bruger

09. juni 2005 - 06:24 #3

nielle...> Ved godt det er muligt rent praktisk at bruge ul, men da en af menupunkterne altid vil have en anden bullet end resten af menupunkterne, vil det være alt for bøvlet at bruge lige netop her.

olebole...>
Min menu er placeret i en boks, defineret af CSS:
#menu {
position:absolute;
overflow:hidden;
width:110px;
height:430px;
padding: 20px 0px 0px 10px;
}

Selve teksten i menupunktet er defineret på følgende måde:
#menupunkt a{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: bold;
background-color: #eee9d6;
color: #000000;
text-decoration: none;
vertical-align: middle;
}

Min menu er lavet sålede i html:
<div id="menu">
<div id="menupunkt">
<img src="grafik/trekant_menu.gif" width="7" height="11" border="0" alt=""><a href="/sider/test.php"> Test 1</a>
<br>
<img src="grafik/trekant_menu.gif" width="7" height="11" border="0" alt=""><a href="/sider/test.php"> Test 1</a>
<br>
<img src="grafik/trekant_menu.gif" width="7" height="11" border="0" alt=""><a href="/sider/test.php"> Test 1</a>
<br>
<img src="grafik/trekant_menu.gif" width="7" height="11" border="0" alt=""><a href="/sider/test.php"> Test 1</a>
<br>
<img src="grafik/trekant_menu.gif" width="7" height="11" border="0" alt=""><a href="/sider/test.php"> Test 1</a>
<br>
<img src="grafik/trekant_menu.gif" width="7" height="11" border="0" alt=""><a href="/sider/test.php"> Test 1</a>
<br>
<img src="grafik/trekant_menu.gif" width="7" height="11" border="0" alt=""><a href="/sider/test.php"> Test 1</a>
<br>
</div>
</div>

Synes godt om

notes2c Nybegynder

09. juni 2005 - 10:19 #4

Synes ikke lige jeg kan se hvor i det bøvlede er. Ser måske kun et udsnit. Men det her kunne være et alternativ, og måske lidt mere læse venligt. Med en visning af hvor let det er at udskifte en bullet... Måske kan du bruge det til noget...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<title>Spørgsmål 624469</title>
<style type="text/css">

</style>
</head>

<body>
<div id="menu">
<div id="menupunkt">
<ul>
<li><a href="#">Test 1</a></li>
<li class="expand"><a href="#">Test 1</a></li>
<li><a href="#">Test 1</a></li>
<li><a href="#">Test 1</a></li>
<li><a href="#">Test 1</a></li>
<li><a href="#">Test 1</a></li>
<li><a href="#">Test 1</a></li>
</ul>
</div>
</div>

</body>
</html>

Synes godt om

Slettet bruger

09. juni 2005 - 19:00 #5

Det bøvlede i at bruge bullets er at der er alt for meget tilpasning for at teksten bliver centreret i forhold til bullet'en, afstanden mellem bullet'en og teksten bliver rigtig, og at afstanden mellem bullets'ene bliver korrekt.

Mangler "kun" en oplysning om hvorvidt det er muligt at justere linjehøjden på en linje indeholdende tekst og billede via CSS?

Synes godt om

notes2c Nybegynder

10. juni 2005 - 02:16 #6

Ved ikke lige om det er det her du mener...

<div style="width: 100px; border: 1px solid red;"><p style="line-height: 40px;">Dette er <img src="x.gif" alt="" width="157" height="19" border="0" style="vertical-align:middle;">en lille test med flere linier</p></div>

Synes godt om

Slettet bruger

11. juni 2005 - 00:17 #7

Det er lige netop noget i den retning, dog kan jeg ikke få det til at virke når teksten er et link, altså med linjer alá denne:
<a href="/sider/forsiden.php"><img src="grafik/trekant_menu.gif" width="7" height="11" border="0" alt=""> Forsiden</a>

Synes godt om

Slettet bruger

13. juni 2005 - 15:37 #8

Har løst problemet af bagvejen.
Line-height understøttes ikke på linjer indeholdende billeder.

Jeg har valgt at lave en spacer med css.

Du får pointene som tak for din tid :o)

Synes godt om

Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML	18	10/09/202515:07	17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML	3	19/03/202522:16	20/03/202513:04
Se og ændre html på en webside Af magger i HTML	4	11/03/202513:55	12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML	5	02/03/202520:05	04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML	3	30/10/202409:37	01/01/202515:27

Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS