DaniWeb IT Discussion Community

Hey everyone,

Okay, i've got a pretty okay understanding of HTML and CSS. Parts of HTML I havnt learnt yet are Forms/Tables and Frames, After I have a basic understanding of that I want to move on to javascript, but I want to do it quickly, so if someone can give me quick awnsers that would be great.

First of all, I just want to ask if this layout looks ok in other browsers:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>::||Cool Layout||::</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<style type="text/css">



body {

margin:50px;

padding:10px;

background:#E0EEEE;

text-align:center;

font-family: sans-serif, serif, courier;

}





#container {

margin:auto;

background:#B2DFEE;

width:720px;

border:1px solid #000;

padding: 5px; }





/* #small {

width:auto;

height:20px;

text-align:right;

padding:3px;

}*/





#feature {

width:500px;

height:120px;

text-align:right;

padding:3px;

background: #67C8FF;

border: 1px solid #000;

margin-left: 35px; 



}



#rightnav

{

float: right;

width: 20%;

padding: 1em;

background: #cdcdcd;

border: 1px solid #000;

z-index:1;



}



#leftnav

{

float: left;

width: 10%;

padding: 2em;

background: #cdcdcd;

border: 1px solid #000;

}



#header {

background:#38B0DE; #67C8FF

width:auto;

height:70px;

border:1px solid #000;

position:relative;

text-align: left;

padding: 5px;



}



#main {

position:relative;

background: #67C8FF;

padding:5px;

width:auto;

border-top:1px solid #000;

border-bottom:1px solid #000;

text-align:left;

border: 1px solid #000;

margin-left: 120px;

z-index:2;

}



h1 {text-align:center;}



#footer {

background: #cdcdcd;

text-align:center;

height: 70px; 

border: 1px solid #000;



}



img {

padding: 5px;

}



</style>

</head>



<body>

<p> 





</p>

<div id="container">

<!-- <div id="small">

<small><a href src="">Home</a> | <a href src="">About</a> | <a href src="">Contact</a></small>

</div> --> 



<div id="header"><IMG SRC="testicon.gif" ALT="[Test image]" ALIGN=right>

<h1 style="text-align: left"> HEADER </h1> 



 </div>

<br>







<div ID="rightnav"><br>

<IMG SRC="testicon.gif" ALT="[Test image]"> <br>

<IMG SRC="testicon.gif" ALT="[Test image]"> <br>

<IMG SRC="testicon.gif" ALT="[Test image]"> <br>

</div>

<div ID="feature">

<b> I am An AMAZING feature </b>

</div>







<br> 

<div ID="leftnav">Excelent <br>

Excelent <br>

Excelent <br>

Excelent <br>

</div>

<div id="main"> 

<small>

<a href src="">Home</a> | <a href src="">About</a> | <a href src="">Contact</a> | <a href src="">About</a> | <a href src="">Contact</a> | <a href src="">About</a> | <a href src="">Contact</a> | <a href src="">About</a> | <a href src="">Contact</a></small>

<h1>Main</h1>

<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>



<p>... sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor 

in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.

</p>



<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore

vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>



<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit </p>



</div>



<br>

<div id="footer"> &copy; Copyright Me!! Mohahaha! </div>



</div>

</body>



</html>

Edit: I've Solved my second question about the form thing, it was quite simple! Then Again it alway is when you have figured it out. :o

PS: I named this topic My Questions, incase I have any more, instead of making another topic. Hope that okay. :)