PDA

View Full Version : [CSS] Help



Jibbish
11-02-2008, 08:32 AM
Right, if you go on my site
http://www.jakeyjames.com/

The buttons are displayed perfectly in FireFox but terribly in Internet Explorer.

Heres the css code


@charset "utf-8";
/* CSS Document */

body, html
{
background: #69696A;
margin: 5px;
font-family: Tahoma;
font-size: 11px;
color: #333233;
padding: 0;
}

tr, td, div
{
font-family: Tahoma;
font-size: 11px;
color: #333233;
}

#container
{
text-align: left;
margin: 0px auto;
background: url('images/container.png');
width: 769px;

}

#innercontainer
{
text-align: left;
margin: 0px auto;
background: url('images/inner_container.png');
width: 743px;

}

#bottom
{
text-align: left;
margin: 0px auto;
background: url('images/bottom.png');
width: 769px;
height: 13px;

}

#logo
{
float: left;
background: url('images/logo.png');
width: 379px;
height: 156px;
}

#logocontainer
{
background: url('images/logo_container.png');
height: 156px;
position: relative;
}

#logocontainer #text
{
position: absolute;
bottom: 0px;
padding-left: 370px!important;
padding-left: 230px;
margin-left: 0px;
}

#logoleft
{
background: url('images/logo_left.png');
height: 156px;
width: 15px;
float: right;
}

#bar
{
background: url('images/bar.png');
height: 82px;
color: #7c7c7c;
}

#bar2
{
text-align: left;
margin: 0px auto;
background: url('images/gradient.png') repeat-x;
height: 4px;
width: 755px;
}

#barleft
{
background: url('images/bar_left.png');
height: 82px;
width: 8px;
float: left;
}

#barright
{
background: url('images/bar_right.png');
height: 82px;
width: 8px;
float: right;
}

#footer
{
background: url('images/footer.png');
height: 36px;
color: #7c7c7c;
}

#content
{
background: url('images/content.png');
width: 95px;
height: 25px;
}

#contentcontainer
{
background: url('images/contentcontainer.png');
width: 513px;
height: 25px;
float: right;
}

#spacer
{
background: url('images/spacer.png');
height: 4px;
width: 6px;
float: left;
}

#spacer2
{
height: 4px;
width: 6px;
float: left;
}

#side
{
background: url('images/side.png');
width: 220px;
color: #FFFFFF;
padding-top: 24px;
padding-left: 5px;
}

#sideheadlines
{
background: url('images/side.png');
padding-left: 5px;
width: 220px;
color: #FFFFFF;
}

img
{
border: 0px;

}


Can you help?

L?KE
11-02-2008, 03:48 PM
Could you work out how to display it in internet explorer, then use this php code to chose the right stylesheet:




<?php

$browser = $_SERVER['HTTP_USER_AGENT'];

if($browser == "ie") {
$style = "ie.css";
} elseif($browser == "firefox") {
$style = "ff.css";
} else {
$style = "other.css";
}

?>
<html>
<head>
<link rel="stylsheet" type="text/css" href="<?php echo $style ?>" />
<title>Browser Specific Stylesheets ;)</title>
</head>
<body>

*Your crud here*

</body>
</html>


Haven't tested, but I'm pretty sure that will work. Please correct me if I'm wrong.

kk.
11-02-2008, 04:02 PM
dont use a table for the navigation. put it in a seperate div such as

#nav {
width:100px;
background-image:"navbutton.png";
}

then just put the home, blog portfolio etc in as text. it will load faster aswell.

Want to hide these adverts? Register an account for free!