Design problem in different browser

Question

0.00/5 (No votes)

See more:

I make website i suffering from problem with design when i open my website in Mozila firefox everything is ok when i open in IE the some menu item in website is mix up. how can i solve this.
Thanks.

Posted 8-Jul-11 7:21am

raviprajapat

Add a Solution

2 solutions

Solution 2

Without code we can't give you exact solution. You should focus on cross browser solutions.

Take a look at these

Links

Cross browser[^]

ASP.NET Browser Compatibility[^] & Detecting Browser Capabilities in ASP.NET 2.0/3.0/3.5[^] by our fellow CPian Alex aka DrABELL[^] & sample site[^] compatible with 4 browsers

HOW TO make web pages "cross browser"[^]
Determining Browser Capabilities in ASP.NET[^]

Browse W3.org

The global structure of an HTML document[^]
Markup Validation Service[^]
CSS Validation Service[^]

Tools

Browser compatibility test Tools[^]

Extras

7 Tips to make your website Cross Browser Compatible[^]
CSS contents and browser compatibility[^]
Compatibility Master Table[^]

Posted 8-Jul-11 7:37am

thatraja

Comments

[no name] 9-Jul-11 2:37am

Nice Links. My 5.

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

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

Parwej Ahamad · Accepted Answer · 2011-07-08T07:32:00

Solution 1

I have some tips for you:
- Look at your css, which element is breaking
- Use those css, which support all browsers
- It would be better if you can post your menu code and CSS
- There are Web Developer tools are available for IE and Firefox so online you can inspect in your element and see the differences

Thanks,

Posted 8-Jul-11 7:32am

Parwej Ahamad

Comments

raviprajapat 8-Jul-11 13:44pm

Menu item Code:-
<div id="menu" runat="server">
<table cellpadding="0" cellspacing="0">
<tr>
<td style="padding: 0 5px 0 0px;">
<asp:HyperLink ID="hlHome" runat="server" NavigateUrl="Home.aspx" CssClass="menulinkdefault">Home
</td>
<td style="padding: 0 5px 0 0px;">
<asp:HyperLink ID="hlAbout" runat="server" NavigateUrl="About.aspx" CssClass="menulinkdefault">About
</td>
<td style="padding: 0 5px 0 0px;">
<asp:HyperLink ID="hlEngineering" runat="server" NavigateUrl="Engineering.aspx" CssClass="menulinkdefault">Engineering
</td>
<td style="padding: 0 5px 0 0px;">
<asp:HyperLink ID="hlSoftware" runat="server" NavigateUrl="Software.aspx" CssClass="menulinkdefault">Software
</td>
<td style="padding: 0 5px 0 0px;">
<asp:HyperLink ID="hlPermits" runat="server" NavigateUrl="Permits.aspx" CssClass="menulinkdefault">Permits/Logistics
</td>
<td style="padding: 0 5px 0 0px;">
<asp:HyperLink ID="hlRecentProjects" runat="server" NavigateUrl="RecentProjects.aspx"
CssClass="menulinkdefault">Recent Projects
</td>
<td style="padding: 0 5px 0 0px;">
<asp:HyperLink ID="hlContact" runat="server" NavigateUrl="Contacts.aspx" CssClass="menulinkdefault">Contact
</td>
<td style="padding: 0 5px 0 0px;">
<asp:HyperLink ID="hlManager" runat="server" NavigateUrl="JobStatus.aspx" CssClass="menulinkdefault">Manager
</td>
<td>
<asp:HyperLink ID="hlInvoice" runat="server" NavigateUrl="InvoiceDetail.aspx" CssClass="menulinkdefault">Invoice
</td>

</tr>
</table>
</div>

Css Class:-

<style type="text/css">

.menulinkdefault
{
background-color: #414141;
color: #FFF;
display: block;
float: left;
height: 18px;
text-decoration: none;
padding: 5px 9px 2px 9px;
border: 1px solid;
text-transform: uppercase;
font-size: 88%;
border-color: #787878;
}
</style>