MacMinds - great minds think different

Navigatie

Zoeken

Inloggegevens

Je bent niet ingelogd.


  • Forum
  •  » Web
  •  » Hobbeltje in DL lijst, waar zit dat in?

#1 23-01-2012 09:33

Martiniman
@ Tikibad
Geregistreerd: 19-09-2006

Hobbeltje in DL lijst, waar zit dat in?

Code:

<!DOCTYPE html 
     PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>Test</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="content-language" content="en" />
<style type="text/css">
dl
{
    width:500px;
    height:200px;
}
 
dl dt
{
    float:left;
    margin-right:10px;
    width:200px;
}
 
dl dd
{
    float:left;
    font-weight:bold;
    width:200px;
}
</style>
</head>
  
<body>
<dl>
<dt>● Made by:</dt><dd>Bandai in Japan</dd>
<dt>● Release year:</dt><dd>1983</dd>
<dt>● Serial number:</dt><dd>5171904</dd>
<dt>● Size:</dt><dd>Large</dd>
</dl>
</body>
</html>

Als je deze HTML bekijkt, zit er een rare sprong na de eerste regel. Het moet er uit zien als een lijstje met data in 2 kolommen, allebei 200px breed. Hoe komt dit en hoe krijg ik deze weg? Het gekke is, dit is een onderdeel van een veel grotere site, en in het geheel is het enkel nog Opera die dit met sprong laat zien, maar wanneer ik de code los in de verschillende browsers laad, is de gekke sprong er overal. Ik wil heb er dus toch wel uit hebben.

Offline

 

#2 23-01-2012 10:43

ateliereb
@ Lochem
Geregistreerd: 28-10-2007
Website

Re: Hobbeltje in DL lijst, waar zit dat in?

Code:

<style type="text/css">
dl
{
    width:500px;
    height:200px;
}
 
dl dt
{
    margin-right:10px;
    width:200px;
    display: inline-block;
    border: 1px solid red;
}
 
dl dd
{
    font-weight:bold;
    width:200px;
    display: inline-block;
    border: 1px solid red;
}
</style>

Offline

 

#3 23-01-2012 10:50

Deskman
Beheerder
@ the desk
Geregistreerd: 14-09-2006
Website

Re: Hobbeltje in DL lijst, waar zit dat in?

Je kunt ook een line-height meegeven. Dat is de reden waarom de regels bij het floaten tegen elkaar opbotsen.

Code:

dl
{
    width:500px;
    height:300px;
    line-height:20px;
}

Offline

 

#4 23-01-2012 11:22

EagerBob
Pro
@ 020
Geregistreerd: 18-09-2006
Website

Re: Hobbeltje in DL lijst, waar zit dat in?

en in plaats van een bullet voor elke description-term te typen kan je ook je eigen bullet of willekeurig ander icoontje meegeven in je stylesheet.


Code:

dt {
     padding-left: 10px;
    background: url("http://dl.dropbox.com/u/604341/check.png") no-repeat;
}

Offline

 

#5 23-01-2012 16:28

Martiniman
@ Tikibad
Geregistreerd: 19-09-2006

Re: Hobbeltje in DL lijst, waar zit dat in?

Blijft vreemd. Ik merk dat

Code:

● aka &# 9679 ;

de boosdoener is voor Opera. Met een gewoon sterretje oid doet ie het gewoon. Waarom weet ik niet. Ik denk dat ik maar voor het plaatje zoals EagerBob beschrijft ga.

Laatst bewerkt door Martiniman (23-01-2012 16:28)

Offline

 

#6 23-01-2012 21:32

EagerBob
Pro
@ 020
Geregistreerd: 18-09-2006
Website

Re: Hobbeltje in DL lijst, waar zit dat in?

die grote stip is een "password dot"
als je

Code:

gebruikt gaat het wel gewoon goed.

Offline

 

#7 23-01-2012 21:33

EagerBob
Pro
@ 020
Geregistreerd: 18-09-2006
Website

Re: Hobbeltje in DL lijst, waar zit dat in?

EagerBob schreef:

die grote stip is een "password dot"
als je

Code:

gebruikt gaat het wel gewoon goed.

[edit]

mmh, die HTML wordt niet goed weergegeven.
ik bedoel dus: & # 8 2 2 6 ;

Laatst bewerkt door EagerBob (23-01-2012 21:34)

Offline

 
  • Forum
  •  » Web
  •  » Hobbeltje in DL lijst, waar zit dat in?

Forum voettekst

MacMinds v 1.05 Powered by PunBB