Omslutning?

Tja
Sitter och har en definitionslista med ett visst antal rader.
Jag vill att DD:en ska flyta upp till hoger om DT:en och anvander darfor float:left;.
Jag vill sen ha en border runt om det hela och det ar har jag far problem.

Hur ska jag gora (validerbar) for att fa denna ram runt om det hela?

Jag har nog testat det mesta utan nagot resultat.

<dl class="mc">
	<dt>Motor</dt>
	<dd>4-takt, luftkyld</dd>
	<dt>Cylinderarrangemang</dt>
	<dd>Rad 4</dd>
	<dt>Ventiler per cylinder</dt>
	<dd>4</dd>
</dl>

dl.mc{
	border: 1px;
	width: 500px;
}
.mc dt{
	width: 250px;
	float:left;
}
.mc dd{
	width: 250px;
	float:left;
}

For att vara lite hemlighetsfull sa for ni inte komma med forslag dar ni pillat nagot med dd:en eller dt:en.

Jag vill ha en losning som ger bordern antingen genom en border pa dl:en eller med en div runt om.

Det här funkar hos mig. Du kan ju lägga den IE-specifika koden i en villkorlig kommentar istället.

* {margin:0;padding:0;}
dl.mc{
	border: 1px solid #000;
	width: 500px;
}
.mc dt{
	width: 250px;
	float:left;
}
.mc dd{
	width: 250px;
	float:left;
}

/*Easy clearing of floats [url]http://www.positioniseverything.net/easyclearing.html[/url]*/
dl.mc:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

dl.mc {display: inline-table;}

/* Hides from IE-mac \*/
* html dl.mc {height: 1%;}
dl.mc {display: block;}
/* End hide from IE-mac */
/*Easy clearing of floats End*/

	dl.mc{
		border: 1px #000 solid;
		width: 500px;
		overflow: auto;
	}

dl.mc{
	border: 1px solid;
	width: 500px;
}
.mc dt{
	width: 250px;
	float:left;
}

Gislaved skrev:

	dl.mc{
		border: 1px #000 solid;
		width: 500px;
		overflow: auto;
	}

Tack, att det var sa fruktansvart enkelt. Har satt jag och testade alla olika losnignar jag kunde komma pa, clear:ade, clear:ade och clear:ade, lite white-space, display:inline osv osv. Bah, tack.

zcorpan skrev:

dl.mc{
	border: 1px solid;
	width: 500px;
}
.mc dt{
	width: 250px;
	float:left;
}

Va?Vad skulle det hjalpa?

Om du låter bli att floata DD så kommer de dels att hamna på rätt plats, samt att DL kommer att sträcka sig ända ner utan att behöva cleara.

[ins]
Jag kanske borde skrivit såhär istället...

dl.mc{
	border: 1px solid;
	width: 500px;
}
.mc dt{
	width: 250px;
	float:left;
}
/* bort...
.mc dd{
	width: 250px;
	float:left;
}
*/

[/ins]