i list

fleur · 26. februar 2004

går det ikke an å ha i en liste? Har en liste og vil gjerne ha linjeskift mellom hvert punkt i lista. Hvordan gjør jeg det?

Det fungerer ikke med <li> blablabla <li> iallefall

Loomy · 26. februar 2004

Det blir vel linjeskift automatisk mellom hvert punkt?

<li>
<ul>Blabla</ul>
<ul>Oeeee</ul>
<ul>Bahbah</ul>
</li>

fleur · 26. februar 2004

jeg tenkte at jeg ville ha enda et linjeskift imellom så det blir en åpen linje mellom hvert punkt, eller kanskje flere åpne linjer

WebKnight · 26. februar 2004

Dette funker. Selv om det kanskje er litt tungvint...

<li>Punkt 1</li><BR><BR>
<li>Punkt 2</li><BR><BR>
<li>Punkt 3</li><BR><BR>
<li>Punkt 4</li><BR><BR>

kvikks · 26. februar 2004

legg en class på listen, der kan du stille margin og padding til ønsket

mellomrom.

F.EKS

CSS

.list {

margin-bottom: 10px;

}

Du kan ogspå formatere selve ul-tagen i css, da slipper du class.

ul {

margin-bottom: 10px;

}

Endret 26. februar 2004 av kvikks

fleur · 26. februar 2004

jeg har prøvd alt det der og det funker. Forklarte meg litt dårlig. Det jeg egentlig vil er å ha 2 linjer med skrift og så 2 linjer uten skrift, 2 linjer med skrift osv osv. Alt dette i en liste.

fleur · 26. februar 2004

forresten så funka ikke det webknight skrev.. med etter <li>

no_remorse · 26. februar 2004

jeg har prøvd alt det der og det funker. Forklarte meg litt dårlig. Det jeg egentlig vil er å ha 2 linjer med skrift og så 2 linjer uten skrift, 2 linjer med skrift osv osv. Alt dette i en liste.

Lista mi: <ul>
<li>en ting</li>
<li>en annen ting</li>
<li class="none"> </li>
<li class="none"> </li>
<li>en ting</li>
<li>en annen ting</li>
<li class="none"> </li>
<li class="none"> </li>
<li>en ting</li>
<li>en annen ting</li>
</ul>

CSS:

li.none{
 list-style: none;
}

..er ikke sikker på om det er dette du mener men..

Endret 26. februar 2004 av no_remorse

kvikks · 26. februar 2004

jeg har prøvd alt det der og det funker. Forklarte meg litt dårlig. Det jeg egentlig vil er å ha 2 linjer med skrift og så 2 linjer uten skrift, 2 linjer med skrift osv osv. Alt dette i en liste.

Du bruker en class for du stiller en linjeavstand ekstra i margin, linje

avstanden finner du ut fra hvor stor skrift du bruker. Du kan også

stille din egen linjeavstand. med CSS seff

FuLu · 26. februar 2004

Slik som dette?

<style type="text/css">
<!--
ul
{
margin: 0;
padding: 0;
list-style: none;
}

li.spacer
{
padding-bottom: 2em;
}
-->
</style>

<ul>
<li>linje1</li>
<li class="spacer">linje2</li>
<li>linje3</li>
<li class="spacer">linje4</li>
<li>linje5</li>
<li>linje6</li>
</ul>

no_remorse · 26. februar 2004

eller kanskje her.. ? :cool:

<html>
<head>
 <title>Liste</title>
 <style type="text/css" language="stylesheet">
 html, body{
 font-family: sans-serif;
 }
 li.tom{
 list-style: none;
 }
 </style>
</head>
<body>
 <ul>
  <li>1</li>
  <li>2</li>
  <li class="tom"> </li>
  <li class="tom"> </li>
  <li>3</li>
  <li>4</li>
  <li class="tom"> </li>
  <li class="tom"> </li>
  <li>5</li>
  <li>6</li>
 </ul>
</body>
</html>

fleur · 26. februar 2004

ja den siste der så veldig bra ut , men jeg får det altså ikke til å fungere. Må være noe feil her.

sånn ser lista mi ut:

<li>blabla</li>

<li>blabla</li>

<li>blabla</li>

<li>blabla</li>

</ul>

og her er css'et: Problemet er at nå får jeg linjeskift, men jeg får med ikonene som står i .liste foran, selvom det står list-style: none i .space

.liste {

font-size: 12px;

margin-top: 70px;

line-height: 20px;

list-style-image: url(../test/smil.gif);

}

.space {

list-style: none;

}

fleur · 26. februar 2004

kanskje det hadde vært lettere å bare lagd en og bare putta det inn der istedetfor list. Men hvordan får jeg isåfall ikoner foran linjene? Nå er ikke ikonene rett foran teksten, de er litt skjeve.

magikern · 26. februar 2004

kanskje det hadde vært lettere å bare lagd en og bare putta det inn der istedetfor list. Men hvordan får jeg isåfall ikoner foran linjene? Nå er ikke ikonene rett foran teksten, de er litt skjeve.

selvom jeg anbefaller list metoden så kan du bruke:

<pre>
<strong>linje 1</strong>
<strong>linje 2</strong>
<strong>linje 3</strong>
</pre>

css

strong:before {
content: open-quote;
color: red;
}

hvis du vil ha noe annet enn "open-quote" se her for mer info:

http://www.w3.org/TR/REC-CSS2/generate.htm...e-after-content

ps:husker ikke i farten om det fungerer i IE...

haugsand · 26. februar 2004

<ul>

<ul>

* {

margin: 0;

padding: 0;

}

ul {

font-size: 1em;

}

li {

margin-bottom: 2em;

}

Denne koden vil legge til et mellomrom under li som er nøyaktig 2 linjer høyt, uansett hvilken em-verdi du velger å sette i ul.

fleur · 26. februar 2004

jeg kan ikke legge inn li { i css'et, for jeg har en annen liste også som IKKE skal ha mellomrom under linjene

magikern · 26. februar 2004

jeg kan ikke legge inn li { i css'et, for jeg har en annen liste også som IKKE skal ha mellomrom under linjene

adskill de med "id" eller "class"

ID -->

<li id="en">
<li id="to">

#en {
ser sånn ut
}
#to {
ser sånn ut
}

CLASS -->

<li class="en">
<li class="to">

.en {
ser sånn ut
}
.to {
ser sånn ut
}

fleur · 26. februar 2004

sånn ja takk skal du ha, nå funker det:) endelig. Tenkte på det med klasser på linjene, men syntes det ble så mye klasser etterhvert i css'et. Er det vanlig å ha veldig mye klasser?

kvikks · 26. februar 2004

sånn ja takk skal du ha, nå funker det:) endelig. Tenkte på det med klasser på linjene, men syntes det ble så mye klasser etterhvert i css'et. Er det vanlig å ha veldig mye klasser?

ja... formatere vær minste ting med class, da kan det bli mange...

magikern · 26. februar 2004

sånn ja takk skal du ha, nå funker det:) endelig. Tenkte på det med klasser på linjene, men syntes det ble så mye klasser etterhvert i css'et. Er det vanlig å ha veldig mye klasser?

kommer vel helt an på fra person til person, jeg pleier å bruke ID til hovedbokser og class til f.eks farge og annet som kanskje skal være likt i flere bokser.

f.eks på forrige siden jeg laget brukte jeg dette "skjelettet":

<div id="top-section">
		<div id="top-row">
			<div id="top-col" class="light"></div>
			<div id="top-col" class="dark"></div>
		</div>	
		<div id="top-row">
                             	<div id="top-col" class="dark"></div>
			<div id="top-col" class="light"></div>
		</div>
	</div>

	<div id="mid-section">
             		<div id="mid-col-1" class="navBar"></div>
             		<div id="mid-col-2"></div>
             		<div id="mid-col-3" class="navBar">
		</div>
	</div>

	<div id="bottom-section"></div>

også er det greit å ha et default layout på alle forskjellige ting og tang du bruker (div, p, pre, blockquote, b, u, ul, li osv osv osv)

ul {}

ul li {}

så har du evt andre som kan være

#col-1 ul li {}

ul #en {}

ul .meny {}

<br /> i list

Anbefalte innlegg

Lenke til kommentar

Videoannonse

Lenke til kommentar

Lenke til kommentar

Lenke til kommentar

Lenke til kommentar

Lenke til kommentar

Lenke til kommentar

Lenke til kommentar

Lenke til kommentar

Lenke til kommentar

Lenke til kommentar

Lenke til kommentar

Lenke til kommentar

Lenke til kommentar

Lenke til kommentar

Lenke til kommentar

Lenke til kommentar

Lenke til kommentar

Lenke til kommentar

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Opprett konto

Logg inn

Hvem er aktive 0 medlemmer