Jump to content

Layout help!


phpwiz

Recommended Posts

Ok, i am trying to make a layout and it isnt working, i have tried MANY diffrent  ways of trying to do this and when i tried to do it it looks like this:

 

screenshot here

 

but i want it to look something like this site: link here!

 

and here is the code:

 

<html>
<head>
	<title>Website</title>
		<style type='text/css'>
		body {
		background: #333333;	
		}

		#container {
		width: 905px;	
		<!-- border-style: solid;
		border-width: 1px;
		border-color: white; -->
		}

		.banner {
		background-image: url('images/banner.png');
		width: 900px;
		height: 132px;	
		}

		.cen {
		background-image: url('images/Comment_top.png');
		width: 494px;
		height: 18px;
		text-align: center;
		color: #000000;
		font-family: arial;
		font-size: 13px;
		}

		.Nav_L {
		background-image: url('images/N_head.png');
		width: 200px;
		height: 17px;
		text-align: center;
		color: #000000;
		font-family: arial;
		font-size: 13px;
		float: left;	
		}

		.Nav_R {
		background-image: url('images/N_head.png');
		width: 200px;
		height: 17px;
		text-align: center;
		color: #000000;
		font-family: arial;
		font-size: 14px;
		float: right;	
		}

		.nav
		{
		text-align: center;
		background-image: url('images/Nav.png');
		text-decoration: none;
		font-family: verdana;
		height: 18px;
		width: 200px;
		font-size: 10px;
		display: block;
		}


		</style>
<head>

<body>
<!-- start and center container -->
<div align='center'>
  <div id='container'>
	<!-- start banner -->
	<center>
		<div class='banner'></div>
	</center>
	<!-- End banner -->
	<!-- start table -->
		<table valign='top'>
	<!-- start Left nav -->
	<div align='left'>
	<div class='Nav_L'>General</div><br>
	<div class='nav'>test</div>

	</div>
	<!-- End Left Nav -->

	<!-- start right nav -->
	<div class='Nav_R'>Statistics</div>
	<!-- End Left Nav -->

	<!-- Start middle -->
	<center>
		<div class='cen'>.::Welcome::.</div>
	</center>
	<!-- End middle -->
		</table>

  </div> 
 </div>
 <!-- End center and container -->
</body>
</html>

 

please can someone help me fix this problem.

 

i kinda need it done asap

Link to comment
Share on other sites

They are completely different. One is a big almost square, and the other is a long rectangle with buttons underneath. And the big square isn't even a site, it's just an image.

 

dude are you blind? i was showing a screenshot of what the code i posted makes the other site is here obviously you can't help me :/

Link to comment
Share on other sites

dude are you blind? i was showing a screenshot of what the code i posted makes the other site is here obviously you can't help me :/

But you forgot to mention the fact that you have to click the image to enter the actual website...

 

Anyway...

 

#wrapper {
   width: 900px;
   margin: auto;
}
#header {
width: 900px;
height: 100px;
}

#left {
width: 200px;
float: left;
}
#right {
width: 200px;
float: right;
}
#middle {
width: 500px;
margin: auto;
}

#footer {
clear: both;
width: 900px;
height: 20px;
}

 

<div id='wrapper'>
<div id='header'></div>
<div id='left'>left</div>
<div id='right'>right</div>
<div id='middle'>middle</div>
<div id='footer'></div>
</div>

 

I have created a basic layout for you there. It's a three column layout with a header and footer...enjoy.

Link to comment
Share on other sites

But you forgot to mention the fact that you have to click the image to enter the actual website...

 

That he did - then he got all hissy on me even though he left out the info. Which says two things:

 

1) Splash pages suck

2) The help you get is directly proportional to the information you give.

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.