BradlyQuib60
New Member
This is really bugging me. I'm using a GridView and want to format it in such a way that the borders are displayed the same in all browsers. At the moment, I'm getting varying results between IE, FF and Chrome. I'm not sure what I'm doing wrong in my CSS (I'm quite new to CSS) but something must be right as one of the browsers displays the borders correctly at any time.The gridview CSS is as follows:\[code\].gridViewData{ height:auto; width:544px; position:relative; text-align:center; background-color:#7D9EBA; border:solid thin black; border-right:none 0px black;}.gridViewData td { padding:2px; border-top-style:none; border-bottom-style:solid; border-left-style:solid; border-right-style:none; border-color:Black; border-width:thin;}.gridViewData th{ height:10px; width: 544px; position:relative; text-align:center; border-top-style:dashed; border-bottom-style:solid; border-left-style:solid; border-right-style:none; border-color:Black; border-width:thin; background-color:white;}.gridViewData .alt{ background-color:Red; }.gridViewData .pgr { background-color:Orange; }\[/code\]I'd like the table to look like this crude attempt at a drawing . The header should have no borders between the cells. \[code\] ____________________________|____________________________||___|__________|________|____||___|__________|________|____||___|__________|________|____|\[/code\]In IE, the header has no top border. In FF, it looks fine an in Chrome there are separators in the header.This has been bugging me for a while, so hopefully someone can shed some light on this. Thanks