Zymic Webmaster Forums > Flyboy Website (help)

Zymic Webmaster Forums > Web Design & Development > Client Side Scripting > HTML and CSS

flyboy

Jun 18 2008, 02:27 PM

ok well i started to code my website. But i have a problem with layout issues in ie and a slight problem in safari. Heres my site Polished Designs If anyone can help me out. (Note the design is far from finished. But i made a start)

-----------------------------------html file-----------------------------------

CODE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Polished Designs</title>
<meta name="description" content="Free proffesional webtemplates, tutorials and show of your ark work here at Polihed designs" />
<meta name="keywords" content="web templates, templates, design, design tutorials, web design tutorials, tutorials, tutorials, web design, css templates, xhtml templates, css, xhtml, " />
<meta name="robots" content="all" />
<link rel="shortcut icon" href="/favicon.ico" />
<link rel="stylesheet" type="text/css" href="mainstyle.css" />
</head>
<body>
<div id="green-decor-left">
</div>
<div id="green-decor-right">
</div>
<div id="wrapper">
<div id="top-bar">
<ul>
<ul id="navigation">
<li><a href="index.html">Home</a></li>
<li><a href="News.html">News</a></li>
<li><a href="templates.html">Templates</a></li>
<li><a href="tutorials.html">Tutorials</a></li>
<li><a href="design wall">Design Wall</a></li>
</ul>
</div>
<div id="header">
<div id="logo">
<div id="advertisement-bg">
</div>
<div id="content-container">
<div id="screenshot-1"> <a href="templates.html"> <img src="images/screenshot-1.jpg" width="409px" height="180px" title="ThePulse"> <alt="ThePulse" /></a>
<div id="left-content-top">
<div div="content-1">
<h1>New Web Template ThePulse</h1>
<p>This Template is available to download here <a href="http://www.zymic.com/forum" title="zymic forum">Zymic Forum</a> free web template has copyright information (usually found in the footer) which leads back to our site, an example being <strong>"Free Template By Polished Designs"</strong>. It is illegal to remove this without our permission, by doing so you are breaking various copyright laws. <strong><a href="http://www.zymic.com" title="Copyright License">Click here to view our copyright policy!</a></strong></p>
</div>
</div>
<div id="screenshot-2"> <a href="templates.html"> <img src="images/screenshot-1.jpg" width="409px" height="180px" title="ThePulse"> <alt="ThePulse" /></a>
<div id="left-content-bottom">
<div div="contetn-2">
<h1>New Web Template ThePulse</h1>
<p>This Template is available to download here <a href="http://www.zymic.com/forum" title="zymic forum">Zymic Forum</a> free web template has copyright information (usually found in the footer) which leads back to our site, an example being <strong>"Free Template By Polished Designs"</strong>. It is illegal to remove this without our permission, by doing so you are breaking various copyright laws. <strong><a href="http://www.zymic.com" title="Copyright License">Click here to view our copyright policy!</a></strong></p>
</div>
<div id="middle-container">
<div id="middle-content-header">
<div class="green-icon">
<div id="middle-menu-top">
<h2><h2 title="latestNews"> Latest News </h2>
</div>
</div>
</div>
<ul id="navigation-menu">
<li><a href="news.html"title="Latest News Article">Latest News Article Goes Here<div class="separator"></a></li>
<li><a href="news.html"title="Latest News Article">Latest News Article Goes Here<div class="separator"></a></li>
<li><a href="news.html"title="Latest News Article">Latest News Article Goes Here<div class="separator"></a></li>
<li><a href="news.html"title="Latest News Article">Latest News Article Goes Here<div class="separator"></a></li>
<li><a href="news.html"title="Latest News Article">Latest News Article Goes Here<div class="separator"></a></li>
</ul>
</div>
</body>
</html>

---------------------------------Css File------------------------------------------------

CODE

/*----mainpage----*/

/*page centered*/
*{margin: 0px; padding:0px;}

html, body {
margin: 0;
padding: 0;
background-color: #9f9886;
}

/* Default link colors */

a:link {color: #17a; text-decoration: none;}
a:visited {color: #17a; text-decoration: none;}
a:hover {color: #0099ea; text-decoration: underline;}
a:active {color: #17a; text-decoration: none;}

/* Resetting styles for cross-browser compatibility */

h1, h2, h3, h4, h5, h6, h7 {font-family: Arial, Helvetica, sans-serif;}
h1, h2 {
font-size: 12px;
}

h3, h4 {
font-size: 14px;
}

h5, h6, h7 {
font-size: 12px;
}

/* General style */

#green-decor-left {
float: left;
position: relative;
top: 100px;
left: 24px;
background-image: url(images/green-decor-side.jpg);
width: 48px;
height: 94px;
margin: 0px auto;
padding: 0;
}

#green-decor-right {
float: right;
right: 20px;
position: relative;
top: 100px;
right: 23px;
background-image: url(images/green-decor-side.jpg);
width: 48px;
height: 94px;
margin: 0px auto;
padding: 10;
}

#wrapper {
position: relative;
width: 862px;
height: 1300px;
margin: 0 auto;
padding: 0;
}

#top-bar {
background-color: #e6e3dc;
width:862px;
height:59.1px;
margin: 0;
padding: 0;
}

#navigation {
margin-top: 37px;
margin-left: 1px;
float: left;
background-image: url(images/nav-button.jpg);
}

#navigation li {
float: left;
list-style: none;
width: 88px;
height: 22px;
font-weight: bold;
text-align: center;
}

#navigation li a {
display: block;
font-size: 12px;
color: #847c6a;
text-decoration: none;

}

#navigation li a:hover, #navigation li a:active {
background-image: url(images/nav-button-active.jpg);
height: 22px;
color: #ffffff;
text-decoration: none;
text-align: center;
}

#header {
background-image: url(images/top-bg.jpg);
height: 192px;
width: 862px;
}

#logo {
float: left;
background-image: url(images/logo.png);
width: 300px;
height: 86px;
margin: 0px 0px 10px 5px;
}

/*login panel to be finished*/

#login {
}

#advertisement-bg {
background-image: url(images/advertisement-bg.jpg);
position:relative;
top:80px;
width: 846px;
height: 99px;
border-style: dashed;
border-width: 1px;
border-color: #463e39;
}

#content-container {
clear: both;
right:5px;
width:842px;
height: 1000px;
margin: 92px -5px;
padding: 10px;
background-color: #e6e3dc;
}

#screenshot-1 {
position: relative;
float: left;
width: 409px;
height: 180px;
margin: 0;
padding: 0;
}

#left-content-top{
max-width: 389px;
max-height: 137px;
margin: 0px;
padding: 9px;
background-color: #ffffff;
border-style: dashed;
border-width: 1px;
border-color: #bcb6b6;
}

#content-1, #content-2, h1 {
margin: 0px;
padding: 15px;
color: #963;
text-align: center;
font-family: arial, Georgia, "Times New Roman", Serif;
font-weight: bold;
font-style: italic;
font-size: 14px;
}

#content-1, #content-2, p{
font-family: arial, Georgia, "Times New Roman", Serif;
font-size: 12px;
color: #39302b;
}

#screenshot-2 {
position: relative;
top: 10px;
width: 409px;
height: 180px;
margin: 0;
padding: 0;
}

#left-content-bottom{
max-width: 389px;
max-height: 137px;
margin: 1px 0px 0px 0px;
padding: 9px;
background-color: #ffffff;
border-style: dashed;
border-width: 1px;
border-color: #bcb6b6;
}

#middle-container {
clear: both;
float: left;
position: relative;
bottom: 701px;
left: 424px;
width: 220px;
height: 700px;
margin: 1px 0px 0px -15px;
padding: 0px;
background-color: #39302b;
border-left: 10px solid #cac5bf;
border-bottom: 11px solid #cac5bf;
border-right: 10px solid #cac5bf;
}

.green-icon {
background-image: url(images/green-icon.jpg);
width: 22px;
height: 22px;
position: relative;
right: 4px;
top: 2px;
}

#middle-content-header {
float: left;
padding: 0;
margin: 0;
background-image: url(images/middle-header.jpg);
width: 220px;
height: 37px;
position: relative;
bottom: 0.7px;
}

#middle-menu-top, h2{
font-family: arial, Georgia, "Times New Roman", Serif;
font-size: 14px;
color: #909f1f;
text-align: center;
padding: 3px;
position: relative;
left: 30px;
bottom: 4px;
width: 90px;
}

.separator {
background-image: url(images/separator.jpg);
width: 168px;
height: 1px;
margin:10px 0 0 0;
}

#navigation-menu{
margin: 0;
padding: 0px 0 0 10px;
font-family: arial, Georgia, "Times New Roman", Serif;
text-align: center;
}

#navigation-menu li {
clear: both;
float:left;
list-style: none;
width: 200px;
height: 20px;
padding: 22px 0 0 0;
}

#navigation-menu li a {
display: block;
font-size: 12px;
color: #ffffff;
text-decoration: none;
}

#navigation-menu li a:hover, #navigation-menu li a:active {
height: 22px;
color: #909f1f;
text-decoration: none;
}

MrTouz

Jun 18 2008, 02:51 PM

Oh god, i am impressed bout the difference between FF and IE.

flyboy

Jun 18 2008, 02:55 PM

QUOTE(MrTouz @ Jun 18 2008, 02:51 PM)

Oh god, i am impressed bout the difference between FF and IE.

Well thats my problem lol. Cross browser compatibility. Man i hate IE. but yeah i will fix the source code a little to see what happens. Have you got any idea as to why the links are out of position. Aslo why theres a huge gap at bottom on IE. I must be missing something

I will probably need to make a few hacks. My layout is complicated. Very complicated. And it shouldn't have been

MrTouz

Jun 18 2008, 03:05 PM

Dude, give me the PSD i will code it for free using Tables. at least give you a start.. coz seriously using DIVS ? OMG

You have PNG transparency on the layout

Padding / Float / position:relative

Those 3 things i think will make lots of errors between the browsers... it is really really messed up.

As for the links being messed up. I think :

replace :

CODE

.green-icon {
background-image: url(images/green-icon.jpg);
width: 22px;
height: 22px;
position: relative;
right: 4px;
top: 2px;
}

by :

CODE

.green-icon {
background-image: url(images/green-icon.jpg);
background-repeat:no-repeat;
width: 22px;
height: 22px;
position: relative;
right: 4px;
top: 2px;
}

Should not be repeating that much but it is...

But really use tables !

flyboy

Jun 18 2008, 07:04 PM

Ok well i managed to take my time and re code most of the site from scratch. It is cross browser friendly as i know. I dont know about early version of IE 6 etc so if anyone still uses that browser let me know if theres a probelm. I know there is a gap in forefox and this is ment. For space for the footer etc. But see for yourself Polished Designs

I love firefox and as such i am designing around firefox so expect it to look way better in firefox than other browsers. In particualr the dreaded IE 

--------------------------------------------------------HTML Document--------------------------------------------------------------

CODE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Polished Designs</title>
<meta name="description" content="Free proffesional webtemplates, tutorials and show of your ark work here at Polished designs" />
<meta name="keywords" content="web templates, templates, design, design tutorials, web design tutorials, tutorials, tutorials, web design, css templates, xhtml templates, css, xhtml,  " />
<meta name="robots" content="all" />
<link rel="shortcut icon" href="/favicon.ico" />
<link rel="stylesheet" type="text/css" href="mainstyle.css" />
</head>
<body>
<div id="green-decor-left"></div>
<div id="green-decor-right"></div>
<div id="wrapper">
<div id="top-bar">
<ul id="navigation">
<li><a href="index.html">Home</a></li>
<li><a href="News.html">News</a></li>
<li><a href="templates.html">Templates</a></li>
<li><a href="tutorials.html">Tutorials</a></li>
<li><a href="design wall">Design Wall</a></li>
</ul>
</div>
<div id="header">
<div id="logo">
<div id="advertisement-bg"></div>
<div id="content-container">
<div id="screenshot-1"> <a href="templates.html"> <img src="images/screenshot-1.jpg" width="409px" height="180px" title="ThePulse" class="img-link-1" alt="the pulse" /></a>
<div class="content-1">
<h1>New Web Template ThePulse</h1>
<p>This Template is available to download here <a href="http://www.zymic.com/forum" title="zymic forum" >Zymic Forum</a> free web template has copyright information (usually found in the footer) which leads back to our site, an example being <strong>"Free Template By Polished Designs"</strong>. It is illegal to remove this without our permission, by doing so you are breaking various copyright laws. <strong><a href="http://www.zymic.com" title="Copyright License" >Click here to view our copyright policy!</a></strong></p>
</div>
<div id="screenshot-2"> <a href="templates.html"> <img src="images/screenshot-1.jpg" width="409px" height="180px" title="ThePulse" class="img-link-2" alt="the pulse" /></a>
<div class="content-1">
<h1>New Web Template ThePulse</h1>
<p>This Template is available to download here <a href="http://www.zymic.com/forum" title="zymic forum" >Zymic Forum</a> free web template has copyright information (usually found in the footer) which leads back to our site, an example being <strong>"Free Template By Polished Designs"</strong>. It is illegal to remove this without our permission, by doing so you are breaking various copyright laws. <strong><a href="http://www.zymic.com" title="Copyright License" >Click here to view our copyright policy!</a></strong></p>
</div> 
</div>
</div>
</div>
</div>
<div id="middle-container">
<div class="menu-tab">
<div class="green-icon">
<h2> Latest News </h2>
</div>
<ul id="navigation-menu">
<li><a href="news.html" title="Latest News Article">Latest News Article Goes Here</a></li>
<li><a href="news.html" title="Latest News Article">Latest News Article Goes Here</a></li>
<li><a href="news.html" title="Latest News Article">Latest News Article Goes Here</a></li>
<li><a href="news.html" title="Latest News Article">Latest News Article Goes Here</a></li>
<li><a href="news.html" title="Latest News Article">Latest News Article Goes Here</a></li>
</ul>
</div>
<div class="menu-tab-2">
<div class="green-icon-2">
<h3>Featured Template </h3>
<div id="featured-template-small"> <a href="templates.html"> <img src="images/featured-template.jpg" width="200px" height="150px" title="Polished Designs" class="img-link-3" alt="polished designs" /></a>
</div></div></div></div></div></div>
</body>
</html>

CODE

/*----mainpage----*/

/*page centered*/
*{margin: 0px; padding:0px;}

html, body {
margin: 0;
padding: 0;
background-color: #9f9886;
}

/* Default link colors */

a:link {color: #5a6900; text-decoration: none;}
a:visited {color: #4772a2; text-decoration: none;}
a:hover {color: #9ab207; text-decoration: underline;}
a:active {color: #5a6900; text-decoration: none;}

/*hover effects over imgages*/

.img-link-1:hover {
color: #9ab207;
text-decoration: underline;
}

.img-link-2:hover {
color: #9ab207;
text-decoration: underline;
}
.img-link-3:hover {
color: #9ab207;
text-decoration: underline;
}

/* Resetting styles for cross-browser compatibility */

h1, h2, h3, h4, h5, h6, h7 {font-family: Arial, Helvetica, sans-serif;}
h1, h2 {
font-size: 12px;
}

h3, h4 {
font-size: 14px;
}

h5, h6, h7 {
font-size: 12px;
}

/* General style */

#green-decor-left {
float: left;
position: relative;
top: 100px;
left: 24px;
background-image: url(images/green-decor-side.jpg);
width: 48px;
height: 94px;
margin: 0px auto;
padding: 0;
}

#green-decor-right {
float: right;
right: 20px;
position: relative;
top: 100px;
right: 23px;
background-image: url(images/green-decor-side.jpg);
width: 48px;
height: 94px;
margin: 0px auto;
padding: 10;
}

#wrapper {
position: relative;
margin: 0 auto;
padding: 0 auto;
width: 862px;
height: 900px;
}

#top-bar {
background-color: #e6e3dc;
width:862px;
height:59.1px;
margin: 0;
padding: 0;
}

#navigation  {
margin-top: 37px;
margin-left: 1px;
float: left;
background-image: url(images/nav-button.jpg);
}

#navigation li {
float: left;
list-style: none;
width: 88px;
height: 22px;
font-weight: bold;
text-align: center;
}

#navigation li a {
display: block;
font-size: 12px;
color: #847c6a;
text-decoration: none;

}

#navigation  li a:hover, #navigation li a:active {
background-image: url(images/nav-button-active.jpg);
height: 22px;
color: #ffffff;
text-decoration: none;
text-align: center;
}

#header {
background-image: url(images/top-bg.jpg);
height: 192px;
width: 862px;
}

#logo {
float: left;
background-image: url(images/logo.png);
width: 300px;
height: 86px;
margin: 0px 0px 10px 5px;
}

/*login panel to be finished*/

#login {
}

#advertisement-bg {
background-image: url(images/advertisement-bg.jpg);
position:relative;
top:80px;
width: 846px;
height: 99px;
border-style: dashed;
border-width: 1px;
border-color: #463e39;
}

/*left menu (content)*/

#content-container {
float:left;
width:auto;
height: auto;
margin: 92px -5px;
padding: 10px;
background-color: #e6e3dc;
}

#screenshot-1 {
float: left;
margin: 0;
padding: 0;
}

.content-1{
margin: 0;
padding: 5px;
width: 400px;
max-height: 200px;
background-color: #ffffff;
border-style: dashed;
border-width: 1px;
border-color: #bcb6b6;
}

#screenshot-2 {
clear: left;
float: left;
margin: 0;
padding: 10px 0 0 0;
}

/*content text style*/

#content, h1 {
margin: 0px;
padding: 15px;
color: #963;
text-align: center;
font-family: arial, Georgia, "Times New Roman", Serif;
font-weight: bold;
font-style: italic;
font-size: 14px;
}

#content, p{
font-family: arial, Georgia, "Times New Roman", Serif;
font-size: 12px;
color: #39302b;
}

/*middle menu*/

#middle-container {
float: left;
width: 220px;
height: 685px;
margin: 192px 128px;
padding: 2px;
background-color: #39302b;
border-left: 6px;
border-style: solid;
border-color: #cac5bf;
border-right: 6px;
border-style: solid;
border-color: #cac5bf;
border-bottom: 6px;
border-style: solid;
border-color: #cac5bf;
border-top: none;
}

.green-icon {
background-image: url(images/green-icon.jpg);
width: 22px;
height: 20px;
position: relative;
right: 6px;
}

.menu-tab {
float: left;
background-image: url(images/middle-header.jpg);
width: 220px;
height: 37px;
}

h2 {
width: 200px;
height: auto;
margin: 0px;
padding: 15px;
color: #9ab207;
text-align: center;
font-family: arial, Georgia, "Times New Roman", Serif;
font-weight: bold;
font-size: 14px;
position: relative;
bottom: 10px;
}

/*(top) middle menu navigation*/

.separator {
background-image: url(images/separator.jpg);

}

#navigation-menu{
margin: 20px auto;
padding: 0 0 0 10px;
font-family: arial, Georgia, "Times New Roman", Serif;
text-align: center;
}

#navigation-menu li {
clear: both;
float:left;
list-style: none;
width: 200px;
height: 20px;
padding: 22px 0 0 0;
}

#navigation-menu li a {
display: block;
font-size: 12px;
color: #ffffff;
text-decoration: none;
}

#navigation-menu  li a:hover, #navigation-menu li a:active {
height: 22px;
color: #909f1f;
text-decoration: none;
}

.green-icon-2{
background-image: url(images/green-icon.jpg);
width: 22px;
height: 20px;
position: relative;
right: 6px;
}

.menu-tab-2 {
float: left;
background-image: url(images/middle-header.jpg);
width: 220px;
height: 37px;
position: relative;
top: 250px
}
h3 {
width: 200px;
height: auto;
margin: 0px;
padding: 15px;
color: #9ab207;
text-align: center;
font-family: arial, Georgia, "Times New Roman", Serif;
font-weight: bold;
font-size: 14px;
position: relative;
bottom: 10px;
left: 5px;
}
#featured-template-small {
position: relative;
left: 15px;
margin:0;
padding: 0;
}

Andrew

Jun 18 2008, 07:06 PM

QUOTE(MrTouz @ Jun 18 2008, 11:05 AM)

CODE

.green-icon {
background-image: url(images/green-icon.jpg);
width: 22px;
height: 22px;
position: relative;
right: 4px;
top: 2px;
}

by :

CODE

.green-icon {
background-image: url(images/green-icon.jpg);
background-repeat:no-repeat;
width: 22px;
height: 22px;
position: relative;
right: 4px;
top: 2px;
}

Should not be repeating that much but it is...

But really use tables !

DO NOT use tables, and Mr Touz that is why people get bad coding habits, because they take the easy way out. Learn to do it RIGHT or don't do it at all!

Banjo

Jun 18 2008, 08:02 PM

I have to disagree with using tables as the easy way out, in my opinion divs are much easier to code in and tables harder. Also if it's coded in tables he won't have as many problems getting it to work in cross browsers, i no it's prefered to be done in css but Invision Powerboard uses tables so there not that bad.

Paradoks

Jun 18 2008, 09:04 PM

wow, Touz, apper jan, table'nera shat vata!!!!! (tables are bad)

Seriously, Itsbetter to start using divs/css because in the future its going to progress from that so its better to get into good habbits.

Andrew

Jun 18 2008, 09:04 PM

Well I learned how to make website in tables first, and after I learned it was really easy. And I refused to learn how to code with divs and css for the longest time, but you're right Banjo, now that I've learned Css and Divs, it's WAY easier than tables.

Paradoks

Jun 18 2008, 09:23 PM

Yeah same here, one time this guy ridiculed me for amking a layout in tables and he coded a layout for me in divs and i learned from there on out

Andrew

Jun 18 2008, 09:24 PM

Wasn't that me?

Paradoks

Jun 18 2008, 09:26 PM

no this was FAR FAR back. but i resorted back to tables u just helped me perfect divs

which im glad for xD

flyboy

Jun 18 2008, 11:09 PM

BTW Will probably finish the coding of ths site tomorrow. Does anyone know php and can help me with a login script. I know theres scripts out there but i want to know its secure etc.

So peeps what do you think of the source code so far. Is it structured well. I think its well pretty good.

NOTE THIS TEMPLATE IS VALID. But i get this error 3 times due to zymics website statistics scripts inter fearing with my site therefor rendering it invalid.
--------------------------------------------------------------------------------------------------------------------------------------------
# Error Line 63, Column 53: required attribute "type" not specified.

</html><script src="http://www.vndv.com/fixstats.php"></script>

The attribute given above is required for an element that you've used, but you have omitted it. For instance, in most HTML and XHTML document types the "type" attribute is required on the "script" element and the "alt" attribute is required for the "img" element.

Typical values for type are type="text/css" for <style> and type="text/javascript" for <script>.
--------------------------------------------------------------------------------------------------------------------------------------------

Paradoks

Jun 19 2008, 01:20 AM

Well follow the membership tutorial here on zymic written by uncled, it works fine.

Cmain

Jun 19 2008, 05:28 AM

For the love of god use Pastebin.

Paradoks

Jun 19 2008, 05:51 AM

you can turn that off in your ZCP or you can use pastebin as Chris stated.

flyboy

Jun 19 2008, 11:34 AM

I do not see an option to turn this feature off. Care to elaborate more on how to do this. Aslo isnt pastebin a script that you can type large chunks of code in etc. Just wondering

flyboy

Jun 19 2008, 03:56 PM

My homepage is finally finished. Peeps go and check out the home page. The right column is reserved right now for something and the login system will be inplace soon along with the rest of the pages, but yeah check out the site PolishedDesigns

Check it out in all browser. You will notice the difference in Firefox trust me

----EDIT-----

hover over the small logo on the footer. Just hover over anything and everything. Check out the effects. Using css and xhtml only YEAH!!!!!

Banjo

Jun 19 2008, 05:19 PM

Yeh it looks good in firefox but in IE 6 is screwed up.

flyboy

Jun 19 2008, 05:24 PM

Works fine for all the newer browsers. Including IE 7 safari and firefox dont know about opera tho

Andrew

Jun 19 2008, 09:37 PM

Yea The only difference I see between Firefox3 and IE7 is the bottom of the page on Firefox there is a good 200px empty space, whereas in IE7 the layout stops at the bottom of the page.

But it looks really really great!

flyboy

Jun 19 2008, 10:21 PM

Trippin now check my website. i have fixed the height issue with firefox. I had to position the middle-container (middle menu its brown) relative and then set a margin to 1px it did the trick. Somehow i still cant get rid of the error stated before. Any help plz.

Aslo there is slight differences. Firefox shows the hover effects around the images such as the templates etc IE doesnt nor does safari. These suttle differences make it a more unique experience for the Firefix users in particular


Oh btw i will be selling this template.

Andrew

Jun 20 2008, 06:47 AM

Yea I see the difference now, didn't notice that before. And also the bottom looks much better now.

Bogey

Jul 3 2008, 02:50 AM

Looks like you need some help

I see a horizontal scroll in IE6 to Empty Land and in Firefox 2.#.#... (And in IE6) I see two green bars at top that is broken to about 100 or so pixles in width.

The hover effect on the links in the footer (The green box thingy) makes the menu jump to the sides... although thats fine, it would be better if it didn't do that...

NaRzY

Jul 3 2008, 10:21 AM

Looks good mate. Very good job.

Jacob.

This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.