devWhiz Posted June 14, 2011 Share Posted June 14, 2011 I wanted to bring the side columns all the way to the side, the left column bordering the browser, ame with the right column, then expand the width of the center area, also widen the header at the top, and have a navigation bar under it, here is the template http://bom-mob.com/clueless/ <html> <head> <title>[Your site name goes here]</title> </head> <STYLE> a:link { color : #C1C4C6; text-decoration : none; } a:visited { color : #C1C4C6; text-decoration : none; } a:active { color : #C1C4C6; text-decoration : none; } a:hover { color :#666666; text-decoration : none; } </STYLE> <body background="images/bg.gif"> <div align="center"> <center> <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#181818" id="AutoNumber1"> <tr> <td><img border="0" src="images/header.gif" width="800" height="101"></td> </tr> </table> </center> </div> <div align="center"> <center> <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#181818" width="800" id="AutoNumber2" height="10"> <tr> <td height="1"></td> <td height="1"></td> <td height="1"></td> </tr> </table> </center> </div> <div align="center"> <center> <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#181818" width="800" id="AutoNumber3" height="522"> <tr> <td width="144" valign="top" height="522"> <img border="0" src="images/navigation.gif" width="150" height="14"><br> <table border="1" cellpadding="2" cellspacing="2" style="border-collapse: collapse" bordercolor="#181818" width="150" id="AutoNumber4" height="9"> <tr> <td width="100%" bgcolor="3D3D3D" height="9" valign="top"> <p align="left"><font face="Verdana" size="1" color="#C1C4C6"> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> </tr> </table> <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#181818" width="105%" id="AutoNumber5" height="1"> <tr> <td width="100%" height="1" > <img border="0" src="images/footer.gif" width="150" height="14"><br> </td> </tr> </table> <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#181818" width="104%" id="AutoNumber6"> <tr> <td width="100%"> <img border="0" src="images/poll.gif" width="150" height="14"></td> </tr> </table> <table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#181818" width="104%" id="AutoNumber7"> <tr> <td width="100%" bgcolor="3D3D3D" valign="top"><font color="#FFFFFF"> <font face="Verdana" size="1"> <br><br><br><br><br><br><br> </td> </tr> </table> <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#181818" width="104%" id="AutoNumber8"> <tr> </td> </tr> </table> <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#181818" width="104%" id="AutoNumber9"> <tr> </tr> </table> <table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#181818" width="104%" id="AutoNumber10"> <tr> <td width="100%" bgcolor="3D3D3D" valign="top"> <table border="0" cellpadding="3" cellspacing="3" style="border-collapse: collapse" bordercolor="#181818" width="100%" id="AutoNumber15"> <tr> <br><br><br><br><br><br><br> </tr> </table> </td> </tr> </table> <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#181818" width="104%" id="AutoNumber11"> <tr> <td width="100%"> <img border="0" src="images/footer.gif" width="150" height="14"><br> </td> </tr> </table> </td> <td width="506" valign="top" height="522"> <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#181818" width="450" id="AutoNumber12" align="center"> <tr> <td align="center"> <img border="0" src="images/content-large.gif" width="450" height="14"></td> </tr> </table> <table border="1" cellpadding="2" cellspacing="2" style="border-collapse: collapse" bordercolor="#181818" width="450" id="AutoNumber13" align="center"> <tr> <td bgcolor="3D3D3D" valign="top"> <font color="#FFFFFF" size="1" face="Verdana"> <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br> <br> </td> </tr> </table> <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#181818" width="450" id="AutoNumber14" align="center"> <tr> <td> <img border="0" src="images/footer-large.gif" width="450" height="14"></td> </tr> </table> <p align="center"><br> </td> <td width="150" valign="top" height="522"> <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#181818" width="100%" id="AutoNumber16"> <tr> <td width="100%"> <img border="0" src="images/news.gif" width="150" height="14"></td> </tr> </table> <table border="1" cellpadding="2" cellspacing="2" style="border-collapse: collapse" bordercolor="#181818" width="100%" id="AutoNumber17"> <tr> <td width="100%" bgcolor="3D3D3D"> <font size="1" face="Verdana" color="#FFFFFF"> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> </td> </tr> </table> <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#181818" width="100%" id="AutoNumber18"> <tr> <td width="100%"> <img border="0" src="images/footer.gif" width="150" height="14"><br> </td> </tr> </table> <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#181818" width="100%" id="AutoNumber19"> <tr> <td width="100%"> <img border="0" src="images/stats.gif" width="150" height="14"></td> </tr> </table> <table border="1" cellpadding="2" cellspacing="2" style="border-collapse: collapse" bordercolor="#181818" width="100%" id="AutoNumber20"> <tr> <td width="100%" bgcolor="3D3D3D" valign="top"> <font face="Verdana" size="1" color="#FFFFFF"> </br> </br> </br> </br> </br> </br> </br> </br> </br> </td> </tr> </table> <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#181818" width="100%" id="AutoNumber21"> <tr> <td width="100%"> <img border="0" src="images/footer.gif" width="150" height="14"><br> </td> </tr> </table> <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#181818" width="100%" id="AutoNumber22"> <tr> <td width="100%"> <img border="0" src="images/featured.gif" width="150" height="14"></td> </tr> </table> <table border="1" cellpadding="2" cellspacing="2" style="border-collapse: collapse" bordercolor="#181818" width="100%" id="AutoNumber23"> <tr> <td width="100%" bgcolor="3D3D3D"><font face="Verdana" size="1" color="#FFFFFF"> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> </td> </tr> </table> <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#181818" width="100%" id="AutoNumber24"> <tr> <td width="100%"> <img border="0" src="images/footer.gif" width="150" height="14"></td> </tr> </table> </td> </tr> </table> </center> </div> <div align="center"> <center> <table border="1" cellpadding="2" cellspacing="2" style="border-collapse: collapse" bordercolor="#181818" width="800" id="AutoNumber25"> <tr> <td bgcolor="3D3D3D"> <p align="center"><font color="#FFFFFF" face="Verdana" size="1">Content Copyright 2005 [your site]. Layout created by </font><font face="Verdana"> <a href="http://www.zymic.com"><font size="1">www.zymic.com</font></a><font size="1"> </font></font></td> </tr> </table> </center> </div> </body> </html> any help is appreciated, thanks! Quote Link to comment Share on other sites More sharing options...
devWhiz Posted June 14, 2011 Author Share Posted June 14, 2011 this is something similar to what I am looking for Quote Link to comment Share on other sites More sharing options...
cssfreakie Posted June 14, 2011 Share Posted June 14, 2011 first of all stop using tables for the pure purpose of creating a template. Second you mind want to have at the bottom of this topic. The exact same technique can be applied. Insted of images (as given in that topic) you can use divs. http://www.phpfreaks.com/forums/index.php?topic=335645.msg1582132#msg1582132 At the very bottom of that post i link to a blog post i made to make it more clear. Anyway it will require you to read abit, because if you are using tables you are already on the wrong track . Quote Link to comment Share on other sites More sharing options...
devWhiz Posted June 14, 2011 Author Share Posted June 14, 2011 ... what are you talking about? I didnt make the template.... thanks for the links I will check them out Quote Link to comment Share on other sites More sharing options...
cssfreakie Posted June 14, 2011 Share Posted June 14, 2011 ... what are you talking about? I didnt make the template.... thanks for the links I will check them out lol dude... And where on earth did I had to read in your post that you didn't make that thing you linked to?? good luck with your future questions Quote Link to comment Share on other sites More sharing options...
devWhiz Posted June 14, 2011 Author Share Posted June 14, 2011 lolol.. umad? I don't see what the problem is... I only stated that I did not create the template, after your reply... first of all stop using tables for the pure purpose of creating a template. Assumed I put the template together myself... Quote Link to comment Share on other sites More sharing options...
cssfreakie Posted June 14, 2011 Share Posted June 14, 2011 lolol.. umad? I don't see what the problem is... I only stated that I did not create the template, after your reply... Besides your lack of manner, you indeed mentioned it afterwards. Assumed I put the template together myself... Most people that come here create stuff themselves and have trouble with it and seek assistance. If you were just here in order to let someone else do the coding, you should consider the freelance forum. So yes I assumed that you created that unless otherwise stated ... Besides that you linked to a template with tables, and you pasted some code with excessive (ab)use of tables. So if you're saying "what are you talking about" exactly that! And so I recommended not to use tables and have a look at something more efficient. Quote Link to comment Share on other sites More sharing options...
per1os Posted June 14, 2011 Share Posted June 14, 2011 Tables are leet, keep using them! I mean really, thats all I ever do my designs in, they are sooooo cool looking and not n00b looking at all. Keep up the good work, and cssfreakie, you should really look into tables for your templates, it is the way of the future, CSS 2/3 is a thing of the past! Quote Link to comment Share on other sites More sharing options...
devWhiz Posted June 14, 2011 Author Share Posted June 14, 2011 /sarcasm Quote Link to comment Share on other sites More sharing options...
devWhiz Posted June 14, 2011 Author Share Posted June 14, 2011 lol sorry, Im out of the HTML loop, this was my first attempt at trying to make a template for my website, I looked around and found t hat premade template, with no prior knowledge of how anything works, but I look at the code cssfreakie had in his blog and its put me in the right direction to create a better template, thanks Quote Link to comment Share on other sites More sharing options...
devWhiz Posted June 14, 2011 Author Share Posted June 14, 2011 I was curious as to what I could use to make a center peice? I got <br><br><br><br><br><br><br><br><br><br> <div id="left-menu" style="background-color:#181818;height:800px;width:160px;float:left;"> </div> <div id="right-menu" style="background-color:#181818;height:800px;width:160px;float:right;"> </div> float:center doesnt seem to work, Im a noob to all of this, just trying to work on my web design skills Quote Link to comment Share on other sites More sharing options...
per1os Posted June 14, 2011 Share Posted June 14, 2011 float:center doesnt seem to work, Im a noob to all of this, just trying to work on my web design skills The best way to work on your web design skills is reading and finding out more information on how it actually works. Just blindly trying and guessing, is a decent way to learn stuff, but often leads to learning the "wrong" stuff. IE, putting the style inline with the HTML, I understand if you are just testing the waters, but yea, bad habits are hard to break. My suggestion would be to find some good resources / tutorials and understand the fundamentals of how webdesign with CSS / HTML / JS works and it will help you immensely if you understand the underlying process and when to user certain items. Quote Link to comment Share on other sites More sharing options...
devWhiz Posted June 14, 2011 Author Share Posted June 14, 2011 thats how I worked with php, I started reading other peoples scripts and now I can write my own script with little help, are their any good sites that you can recommend I take a look at to start getting the grasp of css, and html as well? Thanks for the responses BTW Quote Link to comment Share on other sites More sharing options...
cssfreakie Posted June 14, 2011 Share Posted June 14, 2011 Books are pretty much always better, but if you rather try an online tutorial: you might want to check out: http://www.phpfreaks.com/forums/index.php?topic=110530.msg1576012#msg1576012 Besides that the 'css sticky' is pretty useful, and besides that most links in the css recources part are. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.