css displying problem
Posted: Wed May 11, 2011 8:20 pm
hy guys, i got a css problem, the ul and li tags from inside a php file wont display, i mean the styles wont take efect!
the php file has a while loop and i use the ul and li tags in it, i am guesing the problem is from there somehow but just dont got a clue!
the main html file (index.php)
P.S: this is post number 101
the php file has a while loop and i use the ul and li tags in it, i am guesing the problem is from there somehow but just dont got a clue!
the main html file (index.php)
<?php require('cart.php'); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>shopping cart index</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<div id="wrapper">
<div id="topmenu">
<ul id="text">
<li><a href="#">English</a></li>
<li><a href="#">Spanish</a></li>
<li><a href="#">Romanian</a></li>
</ul>
</div>
<br>
<div id="header">
<ul id="headbox">
<li><a href="index.php"><img src="images/logo.png" border="0" /></a></li>
<li>search bar</li>
<li>cart</li>
</ul>
</div>
<br>
<div id="menubox">
<?php include('menu.php'); ?>
</div>
<br>
<div id="cart">
<?php cart(); ?>
<br />
<?php products(); ?>
</div>
</div>
</body>
</html>
and also before i had 3 separate css files, but just to make things esier for my i put them in one single file.
@charset "utf-8";
/* CSS Document */
a{
font-family:"Arial Rounded MT Bold";
font-size:14px;
color:#FF0;
text-decoration:none;
}
h1{
font-family:Elephant;
font-size:36px;
color:#F00;
margin:0;
padding:0;
text-decoration:none;
}
h3{
font-family:Elephant;
font-size:14px;
font-style:italic;
font-weight:lighter;
color:#fff;
margin:0;
padding:0;
text-decoration:none;
float:left;
}
a:hover{
font-family:"Arial Rounded MT Bold";
font-size:14px;
color:#FF0;
text-decoration:underline;
}
body{
margin:0;
padding:0;
background-image:url(../images/tattoowal2.png);
background-attachment:fixed;
background-position:center top;
background-repeat:no-repeat;
background-color:#333;
font-family:"Arial Rounded MT Bold";
font-size:14px;
color:#F00;
}
#wrapper{
margin:0 auto;
padding:1px;
width:60%;
}
#header{
font-family:"Arial Rounded MT Bold";
font-size:14px;
color:#00f;
margin:0;
padding:0;
width:100%;
height:60px;
line-height:60px;
}
#headbox{
margin:0;
padding:0;
width:100%;
height:60px;
line-height:60px;
}
#headbox li{
margin:0;
padding:0;
width:33%;
height:60px;
line-height:50px;
list-style-type:none;
display:inline;
float:left;
}
#headbox li a{
margin:0;
padding:0;
font-family:"Arial Rounded MT Bold";
font-size:14px;
color:#FFF;
text-align:center;
text-decoration:none;
}
#headbox li a:hover{
margin:0;
padding:0;
font-family:"Arial Rounded MT Bold";
font-size:14px;
color:#F00;
text-align:center;
text-decoration:none;
}
#topmenu{
background-color:#F1F1F1;
width:100%;
height:40px;
line-height:40px;
background-image:url(../images/topgray.png);
background-repeat:repeat-x;
}
#text{
margin:0;
padding:0;
width:40%;
height:40px;
line-height:40px;
}
#text li{
margin:0;
padding-right:5px;
padding-left:5px;
list-style-type:none;
display:inline;
}
#text li a{
margin:0;
padding:0;
text-align:center;
text-decoration:none;
font-family:"Arial Rounded MT Bold";
font-size:16px;
color:#000;
}
#text li a:hover{
margin:0;
padding:0;
text-align:center;
text-decoration:underline;
font-family:"Arial Rounded MT Bold";
font-size:16px;
color:#F00;
}
.users{
margin:0;
padding:0;
width:40%;
}
/*******************************cart.css*/
#cart{
margin:0 auto;
padding:0;
width:100%;
border:solid #FFF 1px;
font-family:"Arial Rounded MT Bold";
font-size:16px;
color:#FFF;
font-weight:lighter;
}
#products{
margin:0 auto;
padding:10px;
text-decoration:none;
font-family:"Arial Rounded MT Bold";
font-size:16px;
color:#fff;
border:solid #FFF 1px;
width:180px;
height:180px;
display:inline-block;
}
#products ul{
margin:0;
padding:0;
}
#products li{
margin:0;
padding:0;
list-style-type:none;
display:inline-block;
float:left;
}
#products li a{
font-family:"Arial Rounded MT Bold";
font-size:16px;
color:#F00;
text-decoration:none;
margin:0;
padding:0;
}
#products li a:hover{
font-family:"Arial Rounded MT Bold";
font-size:16px;
color:#F00;
text-decoration:underline;
margin:0;
padding:0;
}
#menubox{
width:100%;
margin:0 auto;
padding:0;
}
/******************************menu.css*/
#menu{
margin:0;
padding:0;
width:100%;
height:42px;
line-height:42px;
}
#menu li{
margin:0;
padding:0;
list-style-type:none;
text-align:center;
display:block;
float:left;
height:40px;
line-height:40px;
width:19.8%;
background-color:#f1f1f1;
border:solid #000 1px;
}
#menu li:hover{
margin:0;
padding:0;
list-style-type:none;
text-align:center;
display:block;
float:left;
height:40px;
line-height:40px;
width:19.8%;
background-color:#ccc;
}
#menu li a{
margin:0;
padding:0;
font-family:"Arial Rounded MT Bold";
font-size:26px;
color:#000;
text-align:center;
text-decoration:none;
width:100%;
height:40px;
line-height:40px;
}
#menu li a:hover{
margin:0;
padding:0;
font-family:"Arial Rounded MT Bold";
font-size:26px;
color:#000;
text-align:center;
text-decoration:none;
width:100%;
height:40px;
line-height:40px;
}
thanks guys.P.S: this is post number 101