Member Avatar for nikesh.yadav

hey ,
will anybody sugest me how an i use comman CSS to webpage
basically i want to use this for http://www.nikeshyadav.com/ i m using is

<?php 
if (eregi("MSIE",$_SERVER['HTTP_USER_AGENT']))
 echo   '<link href="css/iestyle.css" rel="stylesheet" type="text/css" />';
else
 echo   '<link href="css/otherstyle.css" rel="stylesheet" type="text/css" />';			
 
 ?>

but it is not a good way in my sense,


waiting for ur suggestion

thanxs

  • 2 Contributors
  • 3 Replies
  • 102 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by buddylee17

Dani AI

Generated

— serving a whole alternate stylesheet by sniffing the User-Agent (your PHP approach) will work for a while but is brittle: UA strings change, mobile browsers and newer engines get misdetected, and maintenance becomes painful. is right to emphasise validating markup and starting from a clean baseline. Build a single, resilient stylesheet first, then add very small, targeted overrides only where a browser truly breaks.

Practical workflow:

  • Start with a baseline like Normalize to remove cross-browser quirks.
  • Use a global box-sizing reset so widths behave the same across browsers.
  • Keep the majority of styles in one stylesheet; split out a tiny IE-only override if needed.
  • Prefer feature detection (CSS @supports or Modernizr) over browser detection.

Example patterns (apply these in your main CSS):

/* baseline */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

/* fallback layout for older engines */
.container { width: 100%; }

/* enable modern layout when supported */
@supports (display: flex) {
  .container { display: flex; }
  .sidebar { flex: 0 0 220px; }
  .main { flex: 1; }
}

For legacy IE-only fixes use a very small override file via conditional comments (works up through IE9):

<!--[if lt IE 9]>
<link rel="stylesheet" href="css/ie-fixes.css">
<![endif]-->

Use Modernizr when you need JS-based feature detection and class hooks, but prefer native @supports where possible. Troubleshoot with each browser's dev tools, examine computed styles, and validate markup to catch structural issues early. Keep hacks to absolute last resort and isolate them into a tiny file so the main stylesheet stays clean and maintainable.

Resources: Normalize, Modernizr, MDN @supports.

Recommended Answers

All 3 Replies

Member Avatar for buddylee17

Do you really need multiple stylesheets? I've found that you just need one that works on all browsers. This sounds simple, but it's not. Here are some tricks:
1.) Validate with W3C
2.) Reset margin and borders to 0 at the beginning of the stylesheet. Then redefine if necessary.
3.) Don't place size styles like width and height and surrounding styles like border, margin, and padding in the same tag. Instead, use a container div for surrounding styles and put the size styles inside a child div.
4.) Hacks are a last resort.

Member Avatar for nikesh.yadav

hey buddylee,
first of all thanks for ur replay.

i will try your suggestion but will u give me w3c validation rule link(url)

Member Avatar for buddylee17

http://validator.w3.org/
Also, you can install the free web developer add-on for Firefox and validate the current page by pressing Ctrl+Shift+A. I've found that this makes validating faster and more convenient.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.