locked
ASP.NET button cssclass working in Windows 10 IE, but not Chromium Edge? RRS feed

  • Question

  • User-391083489 posted

    Applying the cssclass to other elements works, but the standard ASP.NET button does not display the class in Edge, it works in IE.  There are many forum posts noted problems with buttons, so I tried UseSubmitBehavior without any change. JQuery is linked in this site's master and people have noted issues. Using the site.cssEdge F12 feature, the effective CSS is input[type="submit" i] user agent stylesheet -webkit-appearance: push-button;  Where does this come from and is it changeable?

    <div>.button_palletok_selected</div> <div>{</div> <div> background-color: #FF00FF !important;</div> <div>}</div> <div> </div> <div>site.master</div> <div>    <link href="<%# ResolveUrl("~/") %>Styles/Site.css" rel="stylesheet" type="text/css" /></div> <div> </div> <div>page</div> <div><asp:button ID="Button1" CssClass="button_palletok_selected" runat="server" UseSubmitBehavior="false" Text="test" /></div> <div> </div> <div>IE</div> <div> </div> <div><input type="button" name="ctl00$MainContent$Button1" value="test" onclick="javascript:__doPostBack(&#39;ctl00$MainContent$Button1&#39;,&#39;&#39;)" id="MainContent_Button1" class="button_palletok_selected" /></div> <div> </div> <div>Edge based on Chrome</div> <div><input type="button" name="ctl00$MainContent$Button1" value="test" onclick="javascript:__doPostBack(&#39;ctl00$MainContent$Button1&#39;,&#39;&#39;)" id="MainContent_Button1" class="button_palletok_selected" /></div> <div> </div> <div><asp:button ID="Button1" CssClass="button_palletok_selected" runat="server" Text="test" /></div> <div> </div> <div>IE</div> <div><input type="submit" name="ctl00$MainContent$Button1" value="test" id="MainContent_Button1" class="button_palletok_selected" /></div> <div> </div> <div>Edge based on Chrome</div> <div><input type="submit" name="ctl00$MainContent$Button1" value="test" id="MainContent_Button1" class="button_palletok_selected" />

    rendered in IE

    rendered in Edge

    Wednesday, February 5, 2020 7:48 PM

Answers

All replies

  • User-391083489 posted

    I'm likely to give up and just rebuild our CSS starting from https://necolas.github.io/normalize.css/8.0.1/normalize.css 

    Any better suggestions?

    Wednesday, February 5, 2020 8:32 PM
  • User288213138 posted

    Hi iragrollman,

    Using the site.cssEdge F12 feature, the effective CSS is input[type="submit" i] user agent stylesheet -webkit-appearance: push-button;  Where does this come from and is it changeable?
    Using the site.cssEdge F12 feature, the effective CSS is input[type="submit" i] user agent stylesheet -webkit-appearance: push-button;  Where does this come from and is it changeable?

    I can't see the image you posted.

    About how to post image you can refer to this link: https://forums.asp.net/t/2162725.aspx

    Or you can figure out which CSS class doesn't work.

    Best regards,

    Sam

    Thursday, February 6, 2020 7:44 AM
  • User-391083489 posted

    The problem is how each browser uses its own defaults for styles and unique processing of CSS, 

    google user agent stylesheet -webkit-appearance: push-button; or for a good discussion look at

    https://superyesmore.com/embed/article/9094165cd5a3f8ddb8ebad6df33b9b2f?u=1520433514 

    There's a reasonably good "set everything" CSS at http://necolas.github.io/normalize.css/ .  Note that the previous Windows 10 Edge displays buttons differently than the Chromium Edge. 

    “The good thing about standards is that there are so many to choose from.” Andrew S. Tanenbaum

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, February 6, 2020 2:36 PM