Joomla! Discussion Forums



It is currently Wed Nov 25, 2009 6:24 am (All times are UTC )

 




Post new topic This topic is locked, you cannot edit posts or make further replies.  [ 2 posts ] 
Author Message
Posted: Thu Aug 24, 2006 7:49 pm 
User avatar
Joomla! Enthusiast
Joomla! Enthusiast
Offline

Joined: Sun Sep 11, 2005 1:34 am
Posts: 171
Alot of people wonder why in some browsers, their site looks differnet. This is because each browser is made differently and each take their own approach to how CSS should be displayed in their browser. Alot of people on the Joomla! forums post how can i fix my CSS, so Ive created this post to answer their questions

This can normally be fixed using the @import function, but if this can not be used, try tying out this.

Code:
<?php

$nav = ( isset( $_SERVER['HTTP_USER_AGENT'] ) ) ? strtolower( $_SERVER['HTTP_USER_AGENT'] ) : '';

   if (stristr($nav, "msie"))
   {
      echo "ie-css.css";
   }
   else
   {
      echo "templatecss.css";
   }
   
?>


The above code  will check if the browser being used is Internet Explorer, if it is it will use the file 'ie-css.css', however if the users browser isn't Internet Explorer, it will use the file 'templatecss.css'.

This function can be expanded to use different browsers, as shown below.

Code:
<?php

$nav = ( isset( $_SERVER['HTTP_USER_AGENT'] ) ) ? strtolower( $_SERVER['HTTP_USER_AGENT'] ) : '';

// checks if browser is Internet Explorer

   if (stristr($nav, "msie"))
   {
      echo "ie-css.css";
   }

// checks if browser is Mozilla

   elseif (stristr($nav, "moz"))
   {
      echo "mozilla-cssfile.css";
   }

// checks if browser is Netscape

   elseif (stristr($nav, "ns"))
   {
      echo "netscape-css.css";
   }

// If browser is a different one

   else
   {
      echo "templatecss.css";
   }
   
?>


I hope this came in help. An example of this script in a real site would be


Code:

<?php defined( '_VALID_MOS' ) or die( 'Direct Access to this location is not allowed.' ); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<?php $iso = split( '=', _ISO );
echo '<?xml version="1.0" encoding="'. $iso[1] .'"?' .'>';
?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<?php mosShowHead(); ?>


<!--  Smart Template Chooser -->
<!--  Created By Jon Hurlock -->

<link rel="stylesheet" type="text/css" href="<?php echo $mosConfig_live_site;?>/templates/

      <?php

      $nav = ( isset( $_SERVER['HTTP_USER_AGENT'] ) ) ? strtolower( $_SERVER['HTTP_USER_AGENT'] ) : '';

      // checks if browser is Internet Explorer

         if (stristr($nav, "msie"))
         {
            echo "ie-css.css";
         }

      // checks if browser is Mozilla

         elseif (stristr($nav, "moz"))
         {
            echo "mozilla-cssfile.css";
         }

      // checks if browser is Netscape

         elseif (stristr($nav, "ns"))
         {
            echo "netscape-css.css";
         }

      // If browser is a different one

         else
         {
            echo "templatecss.css";
         }
   
      ?>
/>

</head>
   
   <body>
   
      <h1>The Body Text For Your Site</h1>
   
   </body>

</html>



The only problem with this script is that i can take alot of coding if you want to write, an individual CSS File for each browser, however you could just load a CSS file first then get this script to over-write the default CSS to just change certain values.

Anyway i hope this helped.


Jon

_________________
:: Dont Insult, unless you can take insult! ::
Usefull links http://forge.joomla.org/sf/projects/accessible_joomla :: a8e Joomla
http://forum.joomla.org/index.php/board,151.0.html :: Welsh Forum


Last edited by jonhurlock on Thu Aug 24, 2006 11:19 pm, edited 1 time in total.

Top
  E-mail  
 
Posted: Sat Nov 25, 2006 7:49 am 
User avatar
Joomla! Master
Joomla! Master
Offline

Joined: Fri Aug 12, 2005 3:47 pm
Posts: 11676
Location: **Translation Matters**
Another solution is to use IE-specific conditional comments

Example:

Code:
<!--[if lte IE 6]>
<link href="templates/<?php echo $this->template ?>/css/ieonly.css" rel="stylesheet" type="text/css" />
<![endif]-->


Good explanation here:
http://www.quirksmode.org/css/condcom.html

_________________
Jean-Marie Simonet / infograf · http://www.info-graf.fr · GMT +1
Qui vult dare parva non debet magna rogare.
---------------------------------
Joomla! Translation Coordination Team


Top
  E-mail  
 
Display posts from previous:  Sort by  
Post new topic This topic is locked, you cannot edit posts or make further replies.  [ 2 posts ] 

Quick reply

 



Who is online

Users browsing this forum: anythinglifted and 3 guests


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot post attachments in this forum

Jump to:  
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group