Issues with Curved Corner Touchdown Feature

Having trouble with getting the round css to work properly in the below code

It seems to be only applying the background color, but not the border styling

The border code is on the same line as the round css:

style=" border :  1px  solid  #D6D6D6;
and the round css is defined below

.Round {
  border-radius: 15px;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
}
<table border="1" width="100%" height="100%" style="border-collapse:collapse; position: fixed; top: 0;      right: 0;     left: 0;">
  <tr height="20%" style="background-color:#3D4552;">
    <th colspan="3" class="shadow">
      <asp:Panel ID="Panel2" runat="server" style="top: 15px; left: 92px; position: absolute; height: 55px; width: 10%;">
        <asp:Image ID="Image1" ImageUrl="~/Images/CasePROLogoweb.jpg" runat="server" />
      </asp:Panel>


    </th>
  </tr>
  <tr height="10%">
    <td colspan="3"></td>
  </tr>
  <tr height="45%">
    <td width="30%"></td>
    <td width="40%" style=" border :  1px  solid  #D6D6D6; " class="Round">' Here is the class for round
    </td>
    <td width="30%"></td>
  </tr>
  <tr height="25%">
    <td colspan="3" colspan="8" align="center" style="font-family: Calibri; font-size: 40pt; color: #FFFFFF">
    </td>
  </tr>
</table>

Answer №1

To make the table border visible, ensure you set the border-collapse property to separate and the border width to 0.

<table border="0" width="100%" height="100%" style="border-collapse:separate; position: fixed; top: 0; right: 0; left: 0;">

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

a pathway leading to the user's profile

I have successfully implemented a code that displays a list of people who are at level 8, which can be seen below Now, I want to make it so that when a user clicks on the username of the individuals listed, they will be redirected to their profile page. H ...

Is it possible to continuously refresh a DIV element?

After spending the past 4 or 5 hours scouring Stack and various other resources, I am still unable to find a solution to my problem. The issue at hand involves an Iframe within a page that displays 5 lines of information fetched from a database. This info ...

Show a clear box over an HTML table row upon mouseover, without highlighting the row

I'm looking to implement a transparent box, with a button, that surrounds a table row when the user hovers over it. I've searched on Google but all the pages only talk about how to highlight rows on hover. I am currently using JavaScript to add ...

How can PHP be utilized to dynamically add classes to <li> elements and alternate them after every third item

I'm trying to find a way to add a class to an unordered list and alternate that class after every third item. Here's the code I have so far: <?php $i=1; foreach($this->items as $item) : ?> <li class="<?php if ($i % 3 == 0) : ...

Pure CSS text slideshow

I'm currently working on developing a text content slideshow using only CSS. Here is the HTML/CSS code I have: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>CSS text slideshow examp ...

Dynamic Dropdown Options in Angular 6 HTML Input Field

Looking to create an interactive HTML5 input field that guides the user with their input. Consider a scenario where the user is required to follow a specific grammar while entering text: rule: <expression> {<op><expression>} expression: ...

Is there a way to ensure a dialog box is positioned in the center of the window?

After adjusting the dimensions of my jQuery UI dialog box with the following code: height: $(window).height(), width: $(window).width(), I noticed that it is no longer centered on the window. Do you have any suggestions on how I can recenter it? ...

Grab Text Class - Python Selenium Automation

I am attempting to extract an element from a webpage using Selenium in Python <span class="_2-1_O"><span dir="auto" class="_1jlxc _3Whw5">Ana Smith</span></span> My goal is to extract the name Ana Smith using Python: contact_name ...

When the state changes, initiate the animation

Currently, I am working with Vue.js and need to animate a navigation menu. My goal is to display two li elements when a user hovers over one of the navigation buttons. At the moment, I have set the data type showActivities to false by default and changed ...

Root location for offline and pre-production in the Backbone boilerplate router

I am currently utilizing the backbone boilerplate found at https://github.com/tbranyen/backbone-boilerplate My development process involves working on static HTML/JS files offline and conducting tests offline before deploying them to another site for pre- ...

Tips for locating the previous CSS value before it was altered by javascript code

I am working on adjusting the CSS variables provided by the system using JavaScript with the following code: document.body.style.setProperty("--rh__primary-base", "rgba(254,80,0)"); However, when I inspect the element, I can see that t ...

Background image spacing

Can anyone explain why there is extra space after my background image in this code snippet? (red line in image highlights the spacing issue) Even though the background image doesn't have this space, it seems to extend beyond where the black color ends ...

unable to properly verify if the value is above 0

$zombieNumber = $_POST['zombie']; if ($zombieNumber > 0){ echo "The number is greater than 0"; } It appears that even if the value of $_POST is -1, the script still considers it greater than 0. Is there a way to handle values under 0? Attemp ...

What is the best way to format specific text as bold within an input text field?

I am attempting to make certain text bold within an input text field. However, I'm uncertain about how to achieve this because HTML code is not recognized inside a text field. Therefore, using <b> will not be effective. Is there a way to bold sp ...

Adding a variable to the .append function in HTML code

I am currently working on a way to include the current date and time when a user comments on a post in my forum. While I have successfully managed to upload the text inputted by the user into the comment section, I am now looking to also dynamically insert ...

How to create a fixed header navigation in SquareSpace

If you take a look at my Squarespace website using the Adirondack theme over here: The issue I'm facing is that whenever I scroll on either desktop or phone, the top header area shrinks. Currently, the navigation remains fixed on the screen and the l ...

Creating a Mui v5 grid item that maximizes its height within a dialog box

I need help setting the height of a Grid Item to occupy all available space in a MUI dialog. In the image below, I am trying to make the Left Side Panel, Main section, and Right Panel extend to fill the orange-colored dialog space. Here is the code on Co ...

What causes materialui styles to vanish upon refreshing in nextjs?

After consulting the materialui documentation (https://material-ui.com/guides/server-rendering/), I was able to find a solution, but I am still unsure of the underlying reason. Why does the style work initially during rendering but disappear upon subs ...

Alter the div's HTML content once the Ajax operation is completed

I have a div element that looks like this: <div class="progress" id="progress-bar"></div> I am using the following JavaScript code along with an ajax call to retrieve some data. The data returned is 0, however, the content is not being added ...

I am facing an issue where the images (IMG) do not align properly when I test the responsiveness using Chrome

Seeking assistance with a design challenge I encountered. The first image showcases a well-structured table on desktop view, while the second image displays an undesired layout when examined using Chrome DevTools. A link to the problematic layout can be fo ...