Styles for submit buttons in IE 8 are dysfunctional

Check out my form here:

It seems that the button at the bottom of the form is not displaying correctly in Internet Explorer, despite working fine on other browsers.

Below is the CSS code I am using for styling the button:

.button
{
  -moz-border-radius:3px;
  -webkit-border-radius:3px;
  border-radius: 3px;
  border: 1px solid #ABABAB;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#E1E1E1), to(#F7F7F7));
  background-image: -webkit-linear-gradient(top, #E1E1E1, #F7F7F7);
  background-image: -moz-linear-gradient(top, #E1E1E1, #F7F7F7);
  background-image: -ms-linear-gradient(top, #E1E1E1, #F7F7F7);
  background-image: -o-linear-gradient(top, #E1E1E1, #F7F7F7);
  background-image: linear-gradient(top, #E1E1E1, #F7F7F7);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#E1E1E1', EndColorStr='#F7F7F7');
  padding: 6px;
  text-transform: uppercase;
  font: 100% "League Gothic", Helvetica, Arial, sans-serif;
  text-decoration:none;
}

Answer №1

You forgot to include the p in the statement border-radius: 3px.

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

How to adjust the size of the text on a button in jQuery mobile using custom

I am facing an issue with my jQuery mobile buttons that are placed inside a fieldset. Specifically, I need to adjust the font-size of one of the buttons. Despite attempting to add an inline style, it did not have the desired effect. Furthermore, I tried u ...

html pagination on website

I am currently displaying my products in rows, however the code I'm using is presenting them in columns instead. I have implemented a datatable pagination feature, but I'm struggling to understand how to properly use it on my website. Can someone ...

Transform colored svg:image elements into grayscale when clicked upon by utilizing d3

Visit this site I'm attempting to change all SVG images created using d3.select to grayscale by using the following function: JavaScript: <script> function convert() { d3.selectAll("image") .style('filter', 'graysc ...

Experiencing the issue of receiving unexpected commas following a div

Here is the code written in TypeScript for creating an HTML table that displays items from nested objects. The code is functional, but there seems to be an issue with extra commas being printed which are not part of any specific line being executed. im ...

Testing the screen size automatically using Javascript

Hello everyone, I've implemented a JavaScript code that triggers an image to slowly appear and darken the background when a link is clicked. However, on an iPad, the background doesn't completely turn black as intended. The CSS specifies that the ...

Display Text Only When Selected - Material-UI

Is there a way to display only the selected tab's text? I came across this code snippet in the MUI documentation that involves showing labels on selection. How can I achieve this effect, maybe by manipulating the state to change the color of the selec ...

Error 404: Troubleshooting an Azure Issue with Custom TrueType Font in .NET MVC 5

I am encountering an issue that has been previously addressed. Despite implementing the suggested solutions, the problem persists. In an effort to enhance my project, I downloaded two custom ttf fonts called Monterey and Bakery. Both fonts have been succ ...

The SpringMvc tiles are failing to display the header and footer

One of the main components in my project is a file called tiles.xml <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE tiles-definitions PUBLIC "-//Apache Software Foundation//DTD Tiles Configuration 3.0//EN" "http://tiles.apa ...

Adjusting image dimensions before delivery for a mobile site

On my desktop website, I currently use images with a size of 500*500. However, when it comes to the mobile version of my site, downloading such large images takes an excessive amount of time. Simply specifying width & height attributes in <img> doesn ...

Removing logo from a collapsed navigation bar: [Bootstrap/HTML]

My goal is to ensure that the website logo is prominently displayed in the center of the navigation bar when users are on a desktop. However, I also want the logo to shift to the top right of the screen and the navbar activation button to move to the left ...

jQuery Popup Button - Maintain the Current Design

I'm currently working with a jQuery dialog and trying to make one of the buttons appear and function as a default button, while still keeping focus on form elements. I managed to achieve this using the code below. However, I encountered an issue where ...

CSS Flexbox - Choose all elements that appear at the start of a new line (Wrap)

Is there a CSS selector that can prevent content insertion on new lines when using the wrap feature in CSS-Flexbox? I am utilizing CSS-Flexbox for a layout with the wrap option, but I do not know the number of lines beforehand. I need a solution where the ...

Display div content depending on the clicked ID in AngularJS

Unique Header Links HTML <ul ng-controller="pageRouteCtrl"> <li ui-sref-active="active"> <a ui-sref="home" class="" ng-click="getPageId('live-view')">LIVE</a> </li> <li> <a ng-clic ...

Issue with Dynamic Image Path in Require Function: Unable to locate the relative module

I've been struggling with an error in VueJs require function for the past two days. I'm attempting to pass a prop to the Home component and then display the image. Home.vue <template> <BlogPost :post="welcomeScreen"/> <B ...

I'm looking for assistance on programmatically adding or modifying the user-agent header in a Chrome browser using Selenium WebDriver. Can anyone help

Seeking assistance on programmatically adding or modifying the user-agent header for Chrome browser using Selenium WebDriver. File addonpath = new File("D:\\innpjfdalfhpcoinfnehdnbkglpmogdi_20452.crx"); ChromeOptions chrome = new ChromeOptions( ...

Styling child elements in Angular using css from its parent element

I have a question: Regarding the structure below <component-parent> <first-child> <second-child> <third-child></third-child> </second-child> </first-child> </component-parent> Now I want t ...

Dividing the webpage background into separate sections to showcase a variety of colors, patterns, and more

I'm in the process of dividing the background on my website into distinct areas. My goal is to have the patterned area extend both horizontally and vertically on either side until it reaches the edge of the visible webpage. Figuring out how to achiev ...

Having trouble getting the hover effect to change the colors of CSS borders

I am experiencing difficulty in changing the background color of the 'About' button to yellow and the border color to blue when it is hovered over. Currently, only a small rectangle around the text changes to yellow on hover and I cannot figure o ...

Ways to detect events even after the object has been swapped out in JavaScript

I am currently developing a JavaScript-based Scrabble game and encountering a puzzling issue. The problem arises when tiles are generated within a tile rack div using a specific function, and an event listener is set up to respond to clicks on the tile div ...

Experiencing Problems with Firefox Height?

Check out my current project on Codepen - it's a clock: http://codepen.io/www139/pen/MaxGyW Here's what it's supposed to look like: https://i.sstatic.net/tOMKh.png If you're using FireFox, you might notice that it looks different comp ...