Dec 7 2005, 12:41 AM, updated 20y ago
i've made the container but there's seems a lot of problem with the float left and float right...
it's not compatible with neither firefox nor ie...
here's the code...
CODE
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>ikram_zidane - test page</title>
<style>
/*
Theme Name: ikram_zidane's digital playground v4
Theme URI: http://www.2ali-bodoh.blogspot.com
Description: simple is me
Version: 4.0
Author: ikram_zidane
*/
p{
margin: 0;
}
body{
background-color: #BDB09A;
text-align: center;
margin: 0 auto;
font-family: arial;
font-size: 11px;
color: #999999;
line-height: 17px;
}
a{
color: #8ECB36;
text-decoration: none;
border-bottom: 1px dotted #8ECB36;
text-transform: capitalize;
}
a:hover{
color: #999999;
text-decoration: none;
border-bottom: 1px dotted #8ECB36;
text-transform: capitalize;
}
#container{
text-align: left;
width: 629px;
margin: 0 auto;
background-image: url(http://img.photobucket.com/albums/v111/ikram_zidane/c7417395.gif);
background-repeat: repeat-y;
}
#header{
height: 142px;
width: 100%;
margin: 0 auto;
background-image: url(http://img.photobucket.com/albums/v111/ikram_zidane/828f9ca0.jpg);
background-repeat: no-repeat;
}
#content{
float: left;
width: 376px;
padding-left: 45px;
}
#sidebar ul {
margin: 0;
padding: 10px 0 10px 0;
position: relative;
list-style-type: none;
}
#sidebar ul li{
margin: 0;
padding: 2px 0 0 0;
text-transform: capitalize;
}
#sidebar ul li a{
width: 175;
display: block;
height: 15px;
padding: 2px 0 2px 10px;
text-decoration: none;
background-color: #252424;
color: #8ECB36;
border-bottom: 1px dotted #8ECB36;
border-right: 3px solid #8ECB36;
}
#sidebar ul li a:hover{
color: #D73D70;
border-bottom: 1px dotted #D73D70;
background-color: #333333;
border-right: 3px solid #D73D70;
}
#sidebar{
float: right;
width: 225px;
padding-right: 45px;
}
#footer{
clear: both;
height: 42px;
width: 100%;
background-image: url(http://img.photobucket.com/albums/v111/ikram_zidane/21b12463.jpg);
background-repeat: no-repeat;
}
h2 {
color: #8ECB36;
font: normal 17px tahoma, Arial, Helvetica, sans-serif;
margin-bottom: 0;
}
.date {
color: #D73D70;
font-family: arial, verdana, tahoma;
font-size: 9px;
font-weight: normal;
text-align: left;
text-transform:uppercase;
margin-bottom: 0;
}
#seperator {
width: 331px;
height: 30px;
background-image: url(http://img.photobucket.com/albums/v111/ikram_zidane/43790cde.jpg);
background-rpeat: no-repeat;
}
</style>
</head>
<body>
<div id="container">
<div id="header"></div>
<div id="content"><blogger>
<h2>» <$BlogItemTitle$> </h2>
<div class="date"><$BlogItemDateTime$></div>
<$BlogItemBody$>
<div id="seperator"></div>
</blogger></div>
<div id="sidebar">
<BloggerArchives>
<ul>
<li><a href="<$BlogArchiveURL$>"><$BlogArchiveName$></a></li>
</ul>
</BloggerArchives>
<ul>
<li><a href="http://2ali-bodoh.blogspot.com">Ikram_zidane's blog</a></li>
<li><a href="http://2ali2004.blogspot.com">Faliq's blog</a></li>
<li><a href="http://azlina.info">ikoko's blog</a></li>
<li><a href="http://silenteve.net">winterwish's blog</a></li>
<li><a href="http://muzamli.com">muzamli's website</a></li>
<li><a href="http://cake.sief3r.com/">cake's blog</a></li>
<li><a href="http://dannyfoo.com">danny foo's website</a></li>
<li><a href="http://jasminfoo.com">jasmin foo's portfolio</a></li>
<li><a href="http://chronosight.net">crynobone's website</a></li>
<li><a href="http://snecx.com">snecx tan's website</a></li>
<li><a href="http://alvinwoon.com">alvin woon's daily misery</a></li>
</ul>
</div>
<div id="footer"></div>
</div>
</body>
</html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>ikram_zidane - test page</title>
<style>
/*
Theme Name: ikram_zidane's digital playground v4
Theme URI: http://www.2ali-bodoh.blogspot.com
Description: simple is me
Version: 4.0
Author: ikram_zidane
*/
p{
margin: 0;
}
body{
background-color: #BDB09A;
text-align: center;
margin: 0 auto;
font-family: arial;
font-size: 11px;
color: #999999;
line-height: 17px;
}
a{
color: #8ECB36;
text-decoration: none;
border-bottom: 1px dotted #8ECB36;
text-transform: capitalize;
}
a:hover{
color: #999999;
text-decoration: none;
border-bottom: 1px dotted #8ECB36;
text-transform: capitalize;
}
#container{
text-align: left;
width: 629px;
margin: 0 auto;
background-image: url(http://img.photobucket.com/albums/v111/ikram_zidane/c7417395.gif);
background-repeat: repeat-y;
}
#header{
height: 142px;
width: 100%;
margin: 0 auto;
background-image: url(http://img.photobucket.com/albums/v111/ikram_zidane/828f9ca0.jpg);
background-repeat: no-repeat;
}
#content{
float: left;
width: 376px;
padding-left: 45px;
}
#sidebar ul {
margin: 0;
padding: 10px 0 10px 0;
position: relative;
list-style-type: none;
}
#sidebar ul li{
margin: 0;
padding: 2px 0 0 0;
text-transform: capitalize;
}
#sidebar ul li a{
width: 175;
display: block;
height: 15px;
padding: 2px 0 2px 10px;
text-decoration: none;
background-color: #252424;
color: #8ECB36;
border-bottom: 1px dotted #8ECB36;
border-right: 3px solid #8ECB36;
}
#sidebar ul li a:hover{
color: #D73D70;
border-bottom: 1px dotted #D73D70;
background-color: #333333;
border-right: 3px solid #D73D70;
}
#sidebar{
float: right;
width: 225px;
padding-right: 45px;
}
#footer{
clear: both;
height: 42px;
width: 100%;
background-image: url(http://img.photobucket.com/albums/v111/ikram_zidane/21b12463.jpg);
background-repeat: no-repeat;
}
h2 {
color: #8ECB36;
font: normal 17px tahoma, Arial, Helvetica, sans-serif;
margin-bottom: 0;
}
.date {
color: #D73D70;
font-family: arial, verdana, tahoma;
font-size: 9px;
font-weight: normal;
text-align: left;
text-transform:uppercase;
margin-bottom: 0;
}
#seperator {
width: 331px;
height: 30px;
background-image: url(http://img.photobucket.com/albums/v111/ikram_zidane/43790cde.jpg);
background-rpeat: no-repeat;
}
</style>
</head>
<body>
<div id="container">
<div id="header"></div>
<div id="content"><blogger>
<h2>» <$BlogItemTitle$> </h2>
<div class="date"><$BlogItemDateTime$></div>
<$BlogItemBody$>
<div id="seperator"></div>
</blogger></div>
<div id="sidebar">
<BloggerArchives>
<ul>
<li><a href="<$BlogArchiveURL$>"><$BlogArchiveName$></a></li>
</ul>
</BloggerArchives>
<ul>
<li><a href="http://2ali-bodoh.blogspot.com">Ikram_zidane's blog</a></li>
<li><a href="http://2ali2004.blogspot.com">Faliq's blog</a></li>
<li><a href="http://azlina.info">ikoko's blog</a></li>
<li><a href="http://silenteve.net">winterwish's blog</a></li>
<li><a href="http://muzamli.com">muzamli's website</a></li>
<li><a href="http://cake.sief3r.com/">cake's blog</a></li>
<li><a href="http://dannyfoo.com">danny foo's website</a></li>
<li><a href="http://jasminfoo.com">jasmin foo's portfolio</a></li>
<li><a href="http://chronosight.net">crynobone's website</a></li>
<li><a href="http://snecx.com">snecx tan's website</a></li>
<li><a href="http://alvinwoon.com">alvin woon's daily misery</a></li>
</ul>
</div>
<div id="footer"></div>
</div>
</body>
</html>
This post has been edited by ikram_zidane: Dec 7 2005, 12:44 AM
Quote
0.0136sec
0.26
5 queries
GZIP Disabled