Table positioning

windows

Guest
Ok here's my problem. It's really not a big one, especially for some of you experts. I'm fairly new to HTML and I need to know what tag i should u to place my table where i want it on my webpage. This is whats going on. I have my links and whatnot on the left side in their own little tables. But, for some reason i can't get that post lower down on the page to go up higher...it doesnt wanna get up there. I don't know much about DIV stuff so I don't really wonna get involved until I know that's what I need to learn. Anywayz, heres my site and if anyone has any tips on getting that post up higher and better positioning for tables, plz lemme know. <br />
<br />
<!-- m --><a class="postlink" href="http://www.angelfire.com/theforce/avalanche0nly/home.html">http://www.angelfire.com/theforce/avala ... /home.html</a><!-- m --> <br />
<br />
<br />
-THANKS-<!--content-->Well, just to let you know that the use of tables for layout is shuned upon because tables weren't designed for layout purposes.<br />
<br />
I'd suggest using the three column + top box method on the following website:<br />
<!-- m --><a class="postlink" href="http://www.thenoodleincident.com/tutorials/box_lesson/boxes.html">http://www.thenoodleincident.com/tutori ... boxes.html</a><!-- m --><br />
<br />
Just view the source and use it to place your content.<br />
<br />
Havik<!--content-->I am not an expert in HTML but if you are new then the CSS code will take a bit of time to learn and understand. <br />
<br />
Try this. In the Table Data Cell ( <TD> ) where the Post Test box is located, reflect the following....<br />
<br />
<TD align="top"><br />
<br />
This should make everything in that table cell align to the top. Also, make sure you do not have any break tags <BR> or new paragraph tags <P> in the table data cell that you are not using. <br />
<br />
Hope this helps!<!--content-->I went and took out all the JavaScript since I didn't think I need to screw with it. I went and got rid of the tables, because as stated before, you shouldn't use them for layout. I have no idea what your CSS code was in there for because I used none of it. Anyway, here's something to weed through. I also would trim that background image down if I were you. I think you could use just a slice of it really.<br />
<br />
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><br />
<html><br />
<head><br />
<title>Home Page</title><br />
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><br />
<style type="text/css" media="all"><br />
<!--<br />
a { color:#B0AA6D;}<br />
a:hover { color:#DCD8A6; }<br />
body {background-image: url(home_files/background.jpg); background-repeat:repeat; }<br />
#content { position:absolute; top:405px; left:20%; width:70%; border:1px solid #CCC; }<br />
#banner { text-align:center; }<br />
#flag { text-align:center; width:15%; position:relative; bottom:10px; }<br />
#menu { position: absolute; top:405px; left:10px; width:15%; text-align:center; }<br />
#menu div { border:1px solid #CCC; width:100%; margin-bottom:10px; }<br />
#menu img { margin-bottom:10px; }<br />
--><br />
</style><br />
</head><br />
<body><br />
<div id="banner"><br />
<img src=http://www.webdeveloper.com/forum/archive/index.php/"home_files/header.jpg" width="768px" height="230px" alt="24/7 Avalanche"><br /><br />
<iframe src=http://www.webdeveloper.com/forum/archive/index.php/"home_files/memberembedded.html" width="468" height="60" frameborder="0" marginheight="0" marginwidth="0" scrolling="no"></iframe><br />
</div><br />
<div id="flag"><br />
<img border="1" src=http://www.webdeveloper.com/forum/archive/index.php/"home_files/sign_white_.jpg" width="100" height="100" alt=""><br />
</div><br />
<div id="menu"> <br />
<div><br />
<a href=http://www.webdeveloper.com/forum/archive/index.php/"http://angelfire.com/theforce/avalanche0nly/home.html">.:Main:.</a><br />
</div><br />
<div><br />
<a href=http://www.webdeveloper.com/forum/archive/index.php/"http://angelfire.com/theforce/avalanche0nly/page2.html">.:List Of Admins:.</a><br />
</div><br />
<div><br />
<a href=http://www.webdeveloper.com/forum/archive/index.php/"http://angelfire.com/theforce/avalanche0nly/page3.html">.:Weapon Bios:.</a><br />
</div><br />
<div><br />
<a href=http://www.webdeveloper.com/forum/archive/index.php/"http://angelfire.com/theforce/avalanche0nly/page4.html">.:Our Screenies:.</a><br />
</div><br />
<div><br />
<a href=http://www.webdeveloper.com/forum/archive/index.php/"http://angelfire.com/theforce/avalanche0nly/page5.html">.:Sent In Screenies:.</a><br />
</div><br />
<div><br />
<a href=http://www.webdeveloper.com/forum/archive/index.php/"http://angelfire.com/theforce/avalanche0nly/page6.html">.:Demos:.</a><br />
</div><br />
<div><br />
<a href=http://www.webdeveloper.com/forum/archive/index.php/"http://angelfire.com/theforce/avalanche0nly/page7.html">.:Contacts:.</a><br />
</div><br />
<div><br />
<a href=http://www.webdeveloper.com/forum/archive/index.php/"http://angelfire.com/theforce/avalanche0nly/page8.html">.:Map Of Avalanche:.</a><br />
</div><br />
</div><br />
<div id="content"><br />
Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test Post Test<br />
</div><br />
</body><br />
</html><!--content-->All of you that replied to my question, i appreciate it. Thank you. I'll keep you updated if u like. :)<!--content-->Yea, thanks again guys. All your info really did help me out. I'm new to all this and someone told me tables were good for that reason...they were wrong. I will start working with the css stuff and that site with all the designs was great. Also I'm looking thru all that code you wrote for me. Man, thank you! You sure took a lot of time with that stuff...thanks again all of you. ;)<!--content-->Hi again. Once again im having trouble...this css stuff is making me mad. It makes no sence. I'm building thru angelfire.com and when i preview all my code to see what the page will look like, it looks great. But, when i type in the link and go to it. It looks nothing like it should! Everything is out of order and extra huge! Anyone know whats up?<br />
<br />
heres the page...<br />
<!-- w --><a class="postlink" href="http://www.angelfire.com/theforce/avalanche0nly/home.html">www.angelfire.com/theforce/avalanche0nly/home.html</a><!-- w --><!--content-->Did you upload my original code, and then view it on your site? If yes, did it look good? I see the Angelfire code was inserted into the wrong place, but I'm seeing <br> tags that should not be there.<br />
<br />
Here's a breakdown of the CSS I used.<br />
<br />
a { color:#B0AA6D;}<br />
<br />
Defines the color of all of your links.<br />
<br />
a:hover { color:#DCD8A6; }<br />
<br />
Defines the color of all of your links when someone hovers their mouse over a link.<br />
<br />
body {background-image: url(home_files/background.jpg); background-repeat:repeat; }<br />
<br />
Defines what background image you are using, and how it should be repeated.<br />
<br />
<br />
#content { position:absolute; top:405px; left:20%; width:70%; border:1px solid #CCC; }<br />
<br />
Positions the main area of text, defines it's width, and gives it a boder that is 1px wide, has a solid line, and has the color of #CCCCCC. #CCC is the shorthand version<br />
<br />
#banner { text-align:center; }<br />
<br />
Defines the alignment of your banner.<br />
<br />
#flag { text-align:center; width:15%; position:relative; bottom:10px; }<br />
<br />
Defines the area of where your Flag image is to be placed, and it's relative position to what's below it.<br />
<br />
<br />
#menu { position: absolute; top:405px; left:10px; width:15%; text-align:center; }<br />
<br />
Positions and defines your menu, and centers it's contents.<br />
<br />
#menu div { border:1px solid #CCC; width:100%; margin-bottom:10px; }<br />
<br />
Defines any <div> tag within another tag that has an id of menu.<br />
<br />
The other line of CSS was left in by mistake and isn't needed. I suggest bookmarking the following link and learning as much as you can.<br />
<br />
<!-- m --><a class="postlink" href="http://www.w3schools.com/css/css_reference.asp">http://www.w3schools.com/css/css_reference.asp</a><!-- m --><!--content-->you are awesome for spending all that time. Thanks a lot. Is it cool to ask u more questions if i need more help..heh?<!--content-->o and to answer ur question. I did upload that all. It looks great thru the page preview command BUT....when i actually type in the site thru my browser, it looks all distorted. Nothing like the preview. Also, if u click the minimize button, it changes the sahpe of soem distorted stuff. LIke the banner. Originally when u load it up, its HUGE. And also the menu is out of place after u minimize it....I dunno its all screwed up and i dont know why it looks different than it says it will in the preview...anyway help plz heh<!--content-->
 
Back
Top