Border;top osv som inte funkar...

MickeA.comMedlem sedan feb. 20034 441 inlägg

10 aug. 2003 20:51#1

Hej

<table style="padding:0px; spacing:0px;" cellpadding='0' cellspacing='0'>
<tr valign='bottom'>
<td valign='bottom' style="text-align: left; height: 19px;background-color:'#C0C0C0'; border: 0px;"><img src='pics/left_flik.gif' border='0'></td>

<td valign='bottom' style="text-align: left; width:1px; height: 19px;background-color:'#808080';border-right: 1px #000000 solid;border-top: 1px #000000 solid;"></td>
<td valign='bottom' style="text-align: left; width:5px; height: 19px;background-color:'#808080';border-top: 1px #000000 solid;"></td>

<td valign='middle' style="text-align: left; height: 19px;background-color:'#808080';border-top: 1px #000000 solid;">Index</td>
<td valign='bottom' style="text-align: left; width:5px; height: 19px;background-color:'#808080';border-top: 1px #000000 solid;"></td>
<td valign='bottom' style="text-align: left; width:1px; height: 19px;background-color:'#808080'; border-right: 1px #000000 solid;border-top: 1px #000000 solid;"></td>
<td valign='bottom' style="text-align: left; width:5px; height: 19px;background-color:'#808080';border-top: 1px #000000 solid;"></td>
<td valign='middle' style="text-align: left; height: 19px;background-color:'#808080'; border: 0px;border-top: 1px #000000 solid;">Varor</td>
<td valign='bottom' style="text-align: left; width:5px; height: 19px;background-color:'#808080';border-top: 1px #000000 solid;"></td>
<td valign='bottom' style="text-align: left; width:1px; height: 19px;background-color:'#808080'; border-right: 1px #000000 solid;border-top: 1px #000000 solid;"></td>
<td valign='bottom' style="text-align: left; width:5px; height: 19px;background-color:'#808080';border-top: 1px #000000 solid;"></td>

<td valign='middle' style="text-align: left; height: 19px;background-color:'#808080';border-top: 1px #000000 solid;">Kundvagn</td>
<td valign='bottom' style="text-align: left; width:5px; height: 19px;background-color:'#808080';border-top: 1px #000000 solid;"></td>
<td valign='bottom' style="text-align: left; width:1px; height: 19px;background-color:'#808080'; border-right: 1px #000000 solid;border-top: 1px #000000 solid;"></td>
<td valign='bottom' style="text-align: left; width:5px; height: 19px;background-color:'#808080';border-top: 1px #000000 solid;"></td>

<td valign='middle' style="text-align: left; height: 19px;background-color:'#808080';border-top: 1px #000000 solid;">Kassa</td>
<td valign='bottom' style="text-align: left; width:15px; height: 19px;background-color:'#808080';border-top: 1px #000000 solid;"></td>
</tr>
</table>

Idéen med det här är att det ska vara topborder 1px svart på alla celler, och border höger på vissa, men det är inte alla som visas.

Sen på de som är border-right, blir inte svarta när jag kollar på sidan:
http://MickeA.dynDNS.org/WebShop/Index.htm

Fattar inte varför, men #000000 blir en gråaktig färg, kolla sidan och sen menyn, det är den som strular, tack !

FlashesMedlem sedan jan. 2003282 inlägg

10 aug. 2003 22:15#2

Är det något åt det här hållet du tänkt dig?

<style type="text/css">
td { text-align:left;
	height:19px;
	background-color:#808080;
	border-top:1px solid #000000;
	border-right:1px solid #000000;
	padding-left:1px;
	padding-right:5px;}
</style>

</head>
<table style="padding:0px; spacing:0px;" cellpadding='0' cellspacing='0'>
<tr>
<td valign='bottom' style="background-color:'#C0C0C0';"><img src='pics/left_flik.gif'></td>
<td valign='middle'>Index</td>
<td valign='middle'>Varor</td>
<td valign='middle'>Kundvagn</td>
<td valign='middle'>Kassa</td>
</tr>
</table>

Observera att jag har flyttat dina style attribut till en style tag i head

Mvh
Jan-Olov

NoMasterMedlem sedan sep. 2002106 inlägg

10 aug. 2003 22:16#3

<html>
Om du istället länkar in klasser så blir det betydligt mera överskådligt. Om du gör en external stilmall kan du dessutom validera den så du vet vad som är fel.

<head>
<style type=text/css>
<!--

.td1 {
	text-align: left; 
	width: 1px; 				/*ps. här sätter du vidden på td-n till 1px*/
	height: 19px;
	background-color: #808080;
	border-right: solid 1px #000000;	/* och här sätter du den högra bordern till 1px*/
	border-top: solid 1px #000000;
}

-->
</style>
</head>
<body>
<table>
	<tr>
		<td class="td1"><img src='pics/left_flik.gif' border='0'></td>

...osv

Som du ser i css-en så anges vidden lite fel. Du har också lagt till några onödiga '. Och glömt några ;. i din kod.