Click here to Skip to main content
16,015,531 members
Please Sign up or sign in to vote.
1.00/5 (2 votes)
I am creating an MVC 5 page with several checkboxes and radio buttons. When I display it in Microsoft Edge the checkboxes and buttons don't render, just the text. When I display the same exact page in IE 11 they render fine. Any ideas what might cause this?

Update: I have proven logically that this is caused by something in the css file. If I eliminate the file the page renders (of course, without all the formatting) and the checkboxes and radio buttons are there and functional.
Posted
Updated 26-Aug-15 9:25am
v2
Comments
Afzaal Ahmad Zeeshan 24-Aug-15 17:15pm    
Can you show the image or screenshot for your web page in Edge?
mlowry 25-Aug-15 18:13pm    
I have them in a .pdf, but this site won't let doesn't seem to have any way to upload. All that shows is the text. I can modify the font, etc., but the checkboxes still don't show, so it's not a font problem. They show perfectly in IE 11. I can show pages from other sites, e.g., w3schools.com, and the checkboxes display OK, so it has to be something with my site but I'll be darned if I can see anything. The page is as simple as I can make it. Code follows:
<pre lang="HTML">
@{
ViewBag.Title = "ProductSearch";
}
@{ Layout = "~/Views/Shared/_left-sidebar.cshtml";}

<form id="fSearch">

Product Search


<p>Please enter your search parameters and check the constructed statement at the bottom, then click on the Search link.</p>
<label for="fKeyword">Keyword: </label>
<input type="text" name="fKeyword" Size="100" />

<br /><br />

Category (Check all that apply. Leave blank for all-inclusive search.)



<input type="checkbox" name="electronics" value="Electronics">Electronics<br />
<input type="checkbox" name="clothing" value="Clothing">Clothing<br />
<input type="checkbox" name="furnishing" value="Furnishing">Furnishing<br />
<input type="checkbox" name="tools" value="Tools">Tools<br />
<input type="checkbox" name="automotive" value="Automotive">Automotive<br />
<input type="checkbox" name="insurance" value="Insurance">Insurance<br />
<input type="checkbox" name="financial" value="Financial">Financial<br />
<input type="checkbox" name="jewelry" value="Jewelry">Jewelry<br />

<br />

Range for search


<input type="radio" name="range" value="club">My Club<br>
<input type="radio" name="range" value="metro">Metro Area<br />
<input type="radio" name="range" value="district">My District<br />
<input type="radio" name="range" value="state">My State<br />
<input type="radio" name="range" value="country">My Country<br />
<input type="radio" name="range" value="world">The World<br />

<br />

I am searching to find:


<input type="radio" name="use" value="personal">Products/services to purchase personally<br>
<input type="radio" name="use" value="business">Establishing a business connection<br />
<input type="radio" name="use" value="provision">Provisioning a Rotary project<br />
<label for="fUse">Other: </label>
<input type="text" name="fUse" Size="50" value="@Request.Form["fUse"]" />

<br /><br />
<!-- <textarea rows="1" cols="70" name="fTranslation">I'm searching for</textarea> -->

<input type="submit" value="Search">
</form>


</pre>
Homero Rivera 26-Aug-15 21:36pm    
your input tags lack a / at the end.... Could it be that IE is very strict?

_webkit-appearance apparently has to do with Edge, Google (and whoever else) wanting to stylize the little boxes and buttons. If you include -webkit-appearance: none in the css it turns off the entire rendering of the boxes and buttons.

I have now tested Edge, Chrome and Firefox and removing this statement has fixed the problem for all of them.
 
Share this answer
 
In my css file I had put the statement:
CSS
form input, form select, form textarea {
        -webkit-appearance: none;
    }


When I commented out this statement everything works.
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900