Heb sinds een tijdje CMSMS prachtig stukje software.
Ook meteen even de CSS code proberen te leren, maar dat is moeilijker dan het lijkt.
Ben bezig met een site voor een vriend:
http://www.mcoptimus.com/cms/
Heb ook 3 browsers geinstalleerd en ging eerst van mijn eige standaard browser uit (opera).
-Opera geeft alles goed weer,
-IE geeft alles weer maar met rare randjes en verschuivingen
-Firefox geeft alles goed weer maar het gehele menu is verdwenen
Hier de CSS:
Code: Select all
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #5E5E5E;
text-align: center;
margin: 0px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
background-image: url(uploads/theme/backfill.jpg);
}
#wrapper {
width: 900px;
padding: 0px;
height: auto;
text-align: left;
border-left: 1px solid #000;
border-right: 1px solid #000;
border-bottom: 1px solid #000;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}
#header {
margin: 0px;
padding: 0px;
height: 87px;
width: 900px;
}
html>body #container {
height: auto;
}
#container {
padding: 0px;
margin: 0px 0px 0px 0px;
background-attachment: scroll;
background-color: white;
background-repeat: repeat-y;
height: 1%;
background-image: url(uploads/theme/new_13.gif);
}
#left {
margin: 0px;
width: 127px;
height: auto;
float: left;
background-image: url(uploads/theme/bannerfill.gif);
padding: 0px;
}
#nav {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 5px;
list-style-image: none;
list-style-type: none;
}
#nav li {
margin: 0px 0px 0px 0px;
padding: 0px;
display: block;
background-attachment: scroll;
background-repeat: no-repeat;
background-position: 0px 50%;
}
#nav li a:link, #nav li a:visited, #nav li a:active {
color: #666;
text-decoration: none;
display: block;
margin: 0px;
padding: 3px 15px 3px 15px;
width: 130px;
}
#nav li a:hover {
color: #999;
text-decoration: none;
}
#center {
height: auto;
width: 176px;
float: left;
line-height: 1.8em;
margin: 0px;
padding: 0px;
text-align: right;
}
#centerrechts {
height: auto;
width: 500px;
float: right;
line-height: 1.8em;
margin: 0px;
text-align: right;
padding-top: 0px;
padding-right: 30px;
padding-bottom: 0px;
padding-left: 0px;
}
#right {
text-align: left;
height: auto;
width: 773px;
float: right;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
margin: 0px;
}
.clearer {
font-size: 0px;
line-height: 0px;
display: block;
margin: 0px;
padding: 0px;
clear: both;
height: 0px;
width: auto;
}
#footer {
height: 83px;
margin: 0px 0px 0px 0px;
text-align: left;
padding: 0px 0px 0px 0px;
background-image: url(uploads/theme/new_16.gif);
}
#footer p {
color: #999;
margin: 0px auto 0px auto;
padding: 0px;
}
#footer a:link, #footer a:visited, #footer a:active {
color: #999;
text-decoration: none;
}
#footer a:hover {
color: #ccc;
text-decoration: none;
}
/* Menu styles */
#home
{
display: inline-table;
width: 94px;
height: 87px;
float: top;
background: url(uploads/theme/new_02.gif) no-repeat 0 0;
}
#home:hover
{
background: url(uploads/theme/over_02.gif) no-repeat 0 0;
}
#pics
{
display: inline-table;
width: 83px;
height: 87px;
background: url(uploads/theme/new_03.gif) no-repeat 0 0;
}
#pics:hover
{
background: url(uploads/theme/over_03.gif) no-repeat 0 0;
}
#log
{
display: inline-table;
width: 77px;
height: 87px;
background: url(uploads/theme/new_04.gif) no-repeat 0 0;
}
#log:hover
{
background: url(uploads/theme/over_04.gif) no-repeat 0 0;
}
#downloads
{
display: inline-table;
width: 137px;
height: 87px;
background: url(uploads/theme/new_05.gif) no-repeat 0 0;
}
#downloads:hover
{
background: url(uploads/theme/over_05.gif) no-repeat 0 0;
}
#guestbook
{
display: inline-table;
width: 144px;
height: 87px;
background: url(uploads/theme/new_06.gif) no-repeat 0 0;
}
#guestbook:hover
{
background: url(uploads/theme/over_06.gif) no-repeat 0 0;
}
#contact
{
display: inline-table;
width: 123px;
height: 87px;
background: url(uploads/theme/new_07.gif) no-repeat 0 0;
}
#contact:hover
{
background: url(uploads/theme/over_07.gif) no-repeat 0 0;
}
/* text styles */
a {text-decoration:none; font-weight: bold; font-family: Verdana; font-size:11px;}
a:link {color:#8FC101}
a:visited {color:#8FC101}
a:hover {color:#405500}
a:active {color:#8FC101}
h1 {
font-size: 12px;
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #405500;
font-weight:normal;
margin: 0px;
padding: 0px;
}
p {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
margin: 0px;
padding: 0px,0px,0px,0px;
line-height:15px;
}
.newssummarypostdate {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #8FC101;
}
Code: Select all
<head>
{stylesheet}
<title>{sitename}</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
</head>
</__body>
<div id="wrapper">
<div id="header">
<img src="uploads/theme/new_01.gif" width="169" height="87"><a id="home" href="index.php?page=home" title="home"></a><a id="pics" href="index.php?page=pictures" title="pics"></a><a id="log" href="index.php?page=log" title="log"></a><a id="downloads" href="index.php?page=downloads" title="pics"></a><a id="guestbook" href="index.php?page=guestbook" title="downloads"></a><a id="contact" href="index.php?page=Contact" title="contact"></a><img src="uploads/theme/new_08.gif" width="73" height="87">
</div>
<div id="container">
<div id="right"><img src="uploads/theme/new_10.gif" width="773" height="55" /></div>
<div id="left">
<div align="left"><img src="uploads/theme/new_09.gif" width="127" height="378" /><br>
</div>
</div>
<div id="center">
{news}
</div>
<div id="centerrechts">
{content}
</div>
<div class="clearer"> </div>
</div>
<div id="footer"> <br><br><br><br><br><p align=center> design by donnie - powered by CMSMS<p>
</div>Alvast bedankt!
