The border feature functions correctly in Google Chrome, however, it does not work in Internet Explorer

I recently created a GridView using asp.net with a black border color. However, I encountered an issue where certain lines were showing up in white which I didn't want to see. It seems there may be a problem when working with child elements, particularly in IE. Below is the styling code that I directly added to the aspx file:

<style type="text/css">
   .GridView2 tbody tr th {
       border-top: thin solid white;
       border-left:thin solid white; 
       padding:5px;
       text-align:center;
   } 
       .GridView2 tbody tr td {
       border-top: thin solid white;
       border-left:thin solid white;
   }

    .GridView2 tbody tr:last-child td{
        border-bottom:thin solid white;
    }
    .GridView2 tbody tr th:last-child,.GridView2 tbody td:last-child{
        border-right:thin solid white;
    }
    .GridView2 tbody tr td{
       padding:5px;

    }

</style>

Next, here is the asp code used for my project:

<asp:GridView ID="GridView1" runat="server" CellPadding="5" HeaderStyle-BorderStyle="None" 
    BorderColor="Black" BorderStyle="Solid" AllowPaging="True" AutoGenerateColumns="false" PageSize="25" DataSourceID="DataSource_struktur" 
    AllowSorting="True" ForeColor="#666666" CellSpacing="1" DataFormatString="{0:###,###,###,###,###}" 
    CaptionAlign="Left"  Width="400px" HeaderStyle-HorizontalAlign="Left" HorizontalAlign="Left" CssClass="GridView2"> 
    <Columns>
        <asp:BoundField ReadOnly=true HeaderText="Master Accounts" DataFormatString="{0:#,0} CMA" DataField="cma" SortExpression="cma" >
        <ItemStyle HorizontalAlign="Center"></ItemStyle>
        </asp:BoundField>

        <asp:BoundField ReadOnly=true DataField="sa_cnt" HeaderText="Service Accounts" SortExpression="sa_cnt" HeaderStyle-HorizontalAlign="Center" >
        <ControlStyle Font-Bold="False" />
        <ItemStyle HorizontalAlign="Center" />
        </asp:BoundField>
   </Columns>

    <HeaderStyle HorizontalAlign="Left" VerticalAlign="Middle" ForeColor="#666666" />
    <PagerSettings Mode="Numeric" />
    <PagerStyle ForeColor="#11AAFF" Font-Names='"Trebuchet MS", Arial, Sans' 
        Font-Size="12px" HorizontalAlign="Left" />
    <RowStyle HorizontalAlign="Left" VerticalAlign="Top" />

Unfortunately, I am unable to provide screenshots of the tables due to limited reputation on this platform.

Answer №1

The HeaderStyle-BorderStyle="None" property has been mistakenly added to your grid view control. Kindly remove this property and test it again.

Answer №2

Include border-width: 5px; within the stylesheet

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Adjust the margin of a child div based on the parent's width, with the use of JavaScript

Currently, I am developing a website at and I am interested in replicating the layout of another site. The site I would like to emulate is , which features multiple sections with child divs that have margins around them. In order to achieve this effect o ...

Arranging the elements in my footer for optimal display

My footer layout expands and the lists in each column become misaligned as I add more links to it. I want to make sure that the lists for each column are aligned horizontally on the same row, with the title of each column also in the same row. levi | ...

Is it possible to assign a specific color and font style to a title tag?

Is there a way to style a page title with a different color and font in the page tab? For example: title{ color: red; font: 12px tahoma;} I thought it would be interesting to incorporate into websites. I attempted the code above in my CSS file, but it di ...

Tips for customizing the CSS of a child component that has been imported from a different module in Angular 2

I have been using agm-snazzy-window from amg-snazzy-window There is a mention that I can modify the css class, but when I try to do so, it doesn't seem to work. Here is an example: map-component.html <agm-snazzy-info-window [closeWhenOthersOp ...

Adjustable pseudo-elements derived from the size of the element

I have a unique feature in my web application that involves a span element with inner text and additional :before and :after pseudo-elements used as decorative lines on each side of the text. Check out this JSFiddle example to see exactly what I mean. .c ...

Fluid Grid System with columns of specific dimensions

Recently delving into the world of Foundation Framework, I've just begun utilizing it for my projects. My current task involves crafting a responsive design with the help of the Foundation Grid system. Specifically, I've set up a grid layout for ...

Two HTML elements positioned alongside each other with inline word wrapping

Apologies for the vague question title, which may not accurately reflect my requirements. This is one reason why I am struggling to find a solution through a simple Google search - I'm unsure of what terms to use. I am attempting to align some "label ...

using c# create xml file

Currently, I am attempting to utilize xmltextwriter and specify a path for writing purposes. My code snippet is as follows: string path = "~/Uploads/site/" + Current.User.Id + .kml"; XmlTextWriter xtr = new XmlTextWrite ...

Creating a Bootstrap carousel with a caption placed on the right side - here's how!

How can I get the caption to appear on the right side instead of the left side? Here is the CSS code I am using: #jumboCarousel { margin-top: 70px; min-height: 300px; max-height: 600px; min-width: 100%; } #jumboCarousel img { min-heig ...

Align the body of the table with the header after populating the table with values

Issue : The data in the table body is misaligned with the headers of each column. Solution : var test_insert1 = '<tr>' + '<td class="td-trad-9">762261</td>' + '<td class="td-trad-7">1.16176&l ...

Adjust the width of the flex columns?

In one of my columns, I have a list that I'm splitting using CSS to wrap the data in the next column after a specific height. However, in the demo, you'll notice there's a lot of white space between the first and second columns. I'm uns ...

<a> slightly off-centered horizontal alignment

I've been trying to center a link using different methods like text-align:center and display:inline-block, but it seems to be slightly off-center. I've attached images along with my code below for reference. Any assistance would be greatly apprec ...

What is the reason behind opting for ng-style over style in AngularJS for applying CSS formatting?

Recently, I've delved into AngularJS and have been exploring its depths for a few days now. I'm curious about the use of ng-style in styling components within both static and dynamic webpages. Given that we already have the traditional style tag ...

Display a different image while another image is in the process of loading

I am currently facing an issue with a div that has a background image set up as follows: <div class="carousel-image" style="background: url(img/background.gif) no-repeat center center;"> </div> Upon loading my webpage, there is a brief ...

Ensure that the element is positioned above other elements, yet below the clickable area

Currently, I am working on developing a notification system that will display a small box in the top right corner of the screen. However, I am facing an issue where the area underneath the notification is not clickable. Is there a way to make this part o ...

How can we use jQuery to extract an HTML element's external stylesheet and add it to its "style" attribute?

My goal is to extract all CSS references from an external stylesheet, such as <link rel="stylesheet" href="css/General.css">, and add them to the existing styling of each HTML element on my page (converting all CSS to inline). The reason for this re ...

Retrieve the ID of an item within an ASP.NET Listview by clicking a button

In my listview, each row has a button with a method on the click event that needs to retrieve the ID of the data item. To store the ID, I placed a hidden field in the listview, but when using ListView1.FindControl("hiddenField"), it returns null. I have e ...

Is there a way to align an element to the right of a centered element?

I am trying to center two inputs ("email" and "password") horizontally on the page. However, I also want to add another item to the right of them while keeping the inputs centered. <div style={{ display: "flex", justifyContent: "center" }}> < ...

navigation bar icons alignment problem

Help with positioning an icon next to the navbar text Example Code: <ul> <li><a href="#" id="other-color" class="ui-btn ui-shadow ui-btn-icon-left ui-custom-icon ui-arrow ui-nodisc-icon">Set Filter</a></li> <li> ...

Fancybox 2 - CSS styles vanish when using Ajax request

I have a fancybox2 with static dummy content that has styling applied. It works fine, but now I need to load dynamic content via ajax. However, when I make the ajax call, the required content loads but loses all css styling, most likely due to changes in t ...