|
-
Nov 18th, 2008, 06:43 PM
#1
Thread Starter
Hyperactive Member
Simple Webpage Setup
The website I am trying to build is as follows:
Website Logo (a jpg file)
Left bar (4 jpgs) The content (some text) Right bar(2j pgs)
Footer(some text)
This is what I have coded so far:
Code:
<body bgcolor="#3598FE">
<!-- start header -->
<div id="header">
<div id="logo" align=center>
<img src="images/The_LastPic_Logo_Final_Nov_3.jpg" width="463" height="193" />
</div>
</div>
<!-- end header -->
<!-- start page -->
<div id="page">
<!-- start leftbar -->
<div id="leftbar" class="sidebar">
<table>
<tr><td><a href="http://www.google.com"><img src="images/baseball_home.jpg" width="230" height="64" style="border-style: none" /></a></td></tr>
<tr><td><a href="http://www.google.com"><img src="images/volley_uploadVideo.jpg" width="230" height="64" style="border-style: none" /></a></td></tr>
<tr><td><a href="http://www.google.com"><img src="images/puck_aboutTLP.jpg" width="230" height="64" style="border-style: none" /></a></td></tr>
<tr><td><a href="http://www.google.com"><img src="images/football_officialRules.jpg" width="230" height="64" style="border-style: none" /></a></td></tr>
<tr><td><a href="http://www.google.com"><img src="images/basketball_ReleaseFroms.jpg" width="230" height="64" style="border-style: none" /></a></td></tr>
</table>
</div>
<!-- end leftbar -->
<!-- start content -->
<div id="content">
<h1 class="title">Hello</h1>
</div>
<!-- end content -->
</div>
<!-- end page -->
</body>
Where I have <h1 class="title">Hello</h1> It is showing up below the table I created, how can I make it print to the right of the table?
Last edited by xxarmoxx; Nov 18th, 2008 at 06:57 PM.
Reason: Spelling errors
-
Nov 19th, 2008, 12:54 AM
#2
Thread Starter
Hyperactive Member
Re: Simple Webpage Setup
Is what I am looking for a span tag?
-
Nov 19th, 2008, 06:39 AM
#3
Hyperactive Member
-
Nov 19th, 2008, 06:47 PM
#4
Thread Starter
Hyperactive Member
Re: Simple Webpage Setup
Thanks a lot knxrb!
I am about 90% done. Here is what I got so far:
Code:
<body bgcolor="#3598FE">
<br /><br />
<div id="header">
<div id="logo" align="center">
<img src="images/The_LastPic_Logo_Final_Nov_3.jpg" width="463" height="193" />
</div>
</div>
<br />
<div id="page" style="width:100%;">
<div id="leftbar" class="sidebar" style="width:230px; float:left;">
<div><a href="http://www.google.com"><img src="images/baseball_home.jpg" width="230" height="64" style="border-style: none" /></a></div>
<div><a href="http://www.google.com"><img src="images/volley_uploadVideo.jpg" width="230" height="64" style="border-style: none" /></a></div>
<div><a href="http://www.google.com"><img src="images/puck_aboutTLP.jpg" width="230" height="64" style="border-style: none" /></a></div>
<div><a href="http://www.google.com"><img src="images/football_officialRules.jpg" width="230" height="64" style="border-style: none" /></a></div>
<div><a href="http://www.google.com"><img src="images/basketball_ReleaseFroms.jpg" width="230" height="64" style="border-style: none" /></a></div>
</div>
<div id="content" style="float:left; padding:15px;">
<p><font size=4 color="#FFFFFF" face="Cooper Black"><b>The Last Pick is a Reality TV show about contestants<br /> that have never played team sports, but who want to play<br /> on a team, competing for a chance to win $500,000, as a<br /> team.</b></font></p>
</div>
<div id="rightbar" class="sidebar" style="float:right; padding:15px;">
<div><a href="http://www.google.com"><img src="images/soccer_signIn.jpg" style="border-style: none" /></a></div>
<div><a href="http://www.google.com"><img src="images/submit_button.gif" style="border-style: none" /></a></div>
</div>
</div>
<br /><br /><br />
<div id="footer" style="padding-top:10px; bottom:0px; top:auto; width:100%; left:0px; position:fixed;">
<center><font color="#FFFFFF" face="Cooper Black"><b><a href="http://www.google.com">Home</a> - <a href="http://www.google.com">Upload Your Video</a> - <a href="http://www.google.com">About The Last Pick</a> - <a href="http://www.google.com">Release forms</a></b></font></center>
<br />
<center><font face="Cooper Black" color="#FFFFFF"><b><a href="http://www.google.com">Contact Us</a> - <a href="http://www.google.com">Terms of Use</a> - <a href="http://www.google.com">Copyright 2008</a></b></font></center>
</div>
</body>
The only problem is on the <div id="content"> tag. I would like to center that as well. I tried adding text-align="center" but the centers the text where it already is (just by the leftbar). How can I make it centered to the entire page?
Again, I appreciate the help!
-
Nov 20th, 2008, 12:06 AM
#5
Re: Simple Webpage Setup
Your going to need to put it into a container (aka another div) and set that to center the text, which will center the div inside
Example:
HTML Code:
<style>
.container { text-align: center; }
.content { /* your content here */ }
</style>
<div class='container'>
<div class='content'>
Your content here...
</div>
</div>
My usual boring signature: Something
-
Nov 20th, 2008, 04:57 AM
#6
Hyperactive Member
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
-
Forum Rules
|
Click Here to Expand Forum to Full Width
|
Reply With Quote
