February 28, 200917 yr Hey there. I'm helping make a site with some people, and having used lightboxes before (on a different site) to view images, I decided to try using them. I got the lightbox code that you're supposed to include in the coding from dynamic drive, and it said that a doctype is necessary. The layout for the site I was going to use the facebox in didn't have one, so I put in the one provided by dynamic drive, changed the default location of the facebox in the code to where mine is, and tried it out. The result was this: http://onyx-dragon.emporers-village-neo.ne...sitelayouts.php The layout appears to work as it should, but when you click on one of the layout names (ie, Teal Stars) the facebox fails to function properly and is all messed up. I tried other doctypes, but then the navigation tabs get messed up, and the facebox doesn't work anyhow. Maybe there's something else besides the doctype thats messed up. I really don't know. Any ideas on what I should do to fix the facebox?
February 28, 200917 yr It takes an aaaaaage to load, but that my just be my dodgey connection. I clicked one of the links and it just took me straight to the image, trying to get back to the page to view source (it's loading). But generally when that happens, it means that you've not told it to launch lightbox when you click the link. Your doctype is in the wrong place anyway, it needs to go at the top. For a start change this <title>Onyx-Dragon</title> <!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" lang="en" xml:lang="en"> <script src="http://onyx-dragon.emporers-village-neo.net/skins/facebox1/facefiles/jquery-1.2.2.pack.js" type="text/javascript"></script> <link href="http://onyx-dragon.emporers-village-neo.net/skins/facebox1/facefiles/facebox.css" media="screen" rel="stylesheet" type="text/css" /> <script src="http://onyx-dragon.emporers-village-neo.net/skins/facebox1/facefiles/facebox.js" type="text/javascript"></script> <script type="text/javascript"> jQuery(document).ready(function($) { $('a[rel*=facebox]').facebox() }) </script> To this <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> <head> <title>Onyx-Dragon</title> <link href="http://onyx-dragon.emporers-village-neo.net/skins/facebox1/facefiles/facebox.css" media="screen" rel="stylesheet" type="text/css" /> <script src="http://onyx-dragon.emporers-village-neo.net/skins/facebox1/facefiles/jquery-1.2.2.pack.js" type="text/javascript"></script> <script src="http://onyx-dragon.emporers-village-neo.net/skins/facebox1/facefiles/facebox.js" type="text/javascript"></script> <script type="text/javascript"> jQuery(document).ready(function($) { $('a[rel*=facebox]').facebox() }) </script> You need to add the <head> and <body> sections in. And it's good practice to call all js at the bottom of the page, it also makes the page appear to load faster (technically it doesn't, but it gives off the illusion it does because the content loads sooner). That should fix almost if not all of your validation issues, once you have valid code, that rules one problem out Edit: ok you have alot of errors (like 180 or so). Most of it's to do with your nesting. Here are some basic ones <br> should be <br /> All images require alt="image description" in the tag Textarea requires rows="20" cols="20" and so on... If your gonna use code in a text area, declare that it's character data (i.e should not be parsed). <textarea rows="20" cols="20"><![CDATA[ Content here ]]> </textarea> I'll clean it up a bit and post the code in a tic, it may or may not fix the lightbox issue though.
February 28, 200917 yr This takes your page down to 35 Errors, it's actually about 10 errors, it's just due to the use of a few depreciated elements and poor nesting it's thrown up more errors than what's actually there. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> <head> <title>Onyx-Dragon</title> <link href="http://onyx-dragon.emporers-village-neo.net/skins/facebox1/facefiles/facebox.css" media="screen" rel="stylesheet" type="text/css" /> <script src="http://onyx-dragon.emporers-village-neo.net/skins/facebox1/facefiles/jquery-1.2.2.pack.js" type="text/javascript"></script> <script src="http://onyx-dragon.emporers-village-neo.net/skins/facebox1/facefiles/facebox.js" type="text/javascript"></script> <script type="text/javascript"> jQuery(document).ready(function($) { $('a[rel*=facebox]').facebox() }) </script> <style type="text/css"> body{ background:url(http://i40.tinypic.com/3581d8y.jpg); } body, div, table, tr, td{ font-family:verdana; color:#FFFFFF; font-size:8pt; width: 500px; top: 0px; } h1 { color: #330000; letter-spacing: 3px; font-size: 13px; font-family: century gothic; } a:link,a:active,a:visited{ color:#330000; font-family:century gothic; text-decoration:none; font-size:8pt; } a:hover{ color:#FEBFBF; font-family:century gothic; text-decoration:none; font-size:8pt; } #content{ display:inline; position:absolute; left:18px; top:113px; width:971px; overflow:auto; height: 316px; } #textbody{ width:500px; } #cbox{ display:inline; position:absolute; left:20px; top:500px; width:650px; } h2 { color: #330000; letter-spacing: 5px; font-size: 18px; font-family: "century gothic"; text-align: right; width:900px; } #content img{border:1px;color:#000000;} #head{display:inline;height:800px;width:auto;top:0px;left:0px;border:0px; overflow: auto; position:absolute;} #hometab{position:absolute; top:-455px; left:200px; height: 44px; width: 191px;} #contenttab{position:absolute; top:23px; left:300px; height: 44px; width: 191px;} #tutorialstab{position:absolute; top:23px; left:400px; height: 44px; width: 191px;} a#HomeTab{top: 500px; display:block;height:44px;width:191px;background-image:url("http://i51.photobucket.com/albums/f369/graphixmaker9/hometabhover.png");} a#HomeTab:hover{top: 500px; background-image:url("http://i51.photobucket.com/albums/f369/graphixmaker9/hometabhover.png");} a#ContentTab{display:block;height:44px;width:191px;background-image:url("http://i51.photobucket.com/albums/f369/graphixmaker9/contenttabnohover.png");} a#ContentTab:hover{background-image:url("http://i51.photobucket.com/albums/f369/graphixmaker9/contenttabhover.png"); } a#TutorialsTab{display: block;height:44px;width:191px;background-image:url("http://i51.photobucket.com/albums/f369/graphixmaker9/tutorialstabnohover.png");} a#TutorialsTab:hover{background-image:url("http://i51.photobucket.com/albums/f369/graphixmaker9/tutorialstabhover.png");} #affies{display:inline;height:800px;width:1003px;top:0px;left:0px;border:0px; overflow: auto; position:absolute;} </style> </head> <body> <div id="head"> <img src="http://i40.tinypic.com/2vm94er.jpg" alt="#"/></div> <div id="hometab"> <a id="HomeTab" href="http://onyx-dragon.emporers-village-neo.net/index.php"></a> </div> <div id="contenttab"> <a id="ContentTab" href="http://onyx-dragon.emporers-village-neo.net/content/index.php"></a> </div> <div id="tutorialstab"> <a id="TutorialsTab" href="http://onyx-dragon.emporers-village-neo.net/tutorials/index.php"></a> </div> <div id="content"> <div id="textbody"> <h2>Website Layouts</h2> <h1>Shapes and Colors</h1> Click on the name for a preview or each layout. Love them? Click <a href="#">here</a> to download this series of layouts. <br/><br/> <br/><a href="http://i41.tinypic.com/2yjomsm.jpg" rel="facebox">Teal Stars</a> <br/><textarea rows="20" cols="20"> <![CDATA[ <style> body{ background-image:url(http://img10.imageshack.us/img10/4788/stars2wl6.jpg); background-repeat:repeat-y; background-color:#149BAA; } body,table,td,tr,p{ color:#000000; font-size:10px; font-family:verdana; line-height:15px; } h1{ font-family:century gothic, georgia; font-size:20px; line-height:25px; color:#149BAA; border-bottom:2px dashed #149BAA; text-align:right; } h2{ font-family:century gothic, georgia; font-size:20px; line-height:25px; color:#149BAA; border-bottom:2px dashed #149BAA; text-align:left; } b{ color:#149BAA; } i{ color:#2AA8B6; font-style:italic; } u{ color:#2AA8B6; border-bottom:1px dashed #149BAA; text-decoration:none; } a:link,a:visited,a:active{ color:#149BAA; font-weight:bold; border-bottom:1px dashed #149BAA; text-decoration:none; } a:hover{ color:#2AA8B6; text-decoration:none; font-weight:normal; } #text{ position:absolute; left:50px; top:150px; width:400px; overflow:auto; } #image{ position:absolute; top:0px; left:0px; } </style> <div ID="image"> <img src="http://img17.imageshack.us/img17/8792/starseb3.jpg" alt="#" /> </div> <div ID="text"> <h1>Header</h1> <b>Bold</b> <i>italic</i> <u>underlined</u> <a href="#">link</a>, consectetur adipiscing elit. Vivamus ac nulla ac lectus elementum tincidunt. Nulla facilisi. Vestibulum lobortis. Mauris interdum mauris sit amet ligula. Proin ante. Vivamus sed nunc et lectus feugiat eleifend. Nam elit mi, viverra quis, iaculis sit amet, volutpat at, lacus. Nunc velit nibh, laoreet ut, cursus eget, feugiat ac, diam. Morbi mollis massa. Proin id augue. Sed facilisis massa at lacus. Ut eget leo. Nunc porta diam sed eros. <br/><br/> Pellentesque et nisi. Morbi dignissim lectus ut erat. Mauris euismod, diam nec bibendum lobortis, sem metus luctus purus, et aliquet nunc justo gravida arcu. Nulla dignissim ante suscipit orci. Vivamus justo dui, tempor sed, eleifend non, placerat in, risus. Vestibulum facilisis libero a eros. Vivamus quis elit nec neque eleifend malesuada. Integer luctus, mi ut posuere egestas, mauris tortor dictum leo, non sollicitudin nulla ligula vel risus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi suscipit mauris id purus. Vestibulum diam purus, mollis et, porta at, vehicula sit amet, eros. Aliquam sem. Vestibulum ante. Quisque eget dui a leo condimentum sollicitudin. <h2>Header(2)</h2> Mauris placerat elit vel lectus. Mauris aliquet, purus nec luctus vehicula, enim orci tristique libero, et iaculis tortor urna a erat. Donec blandit quam nec odio. Nunc ipsum. Suspendisse varius eros at ligula. Sed sit amet massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque odio ipsum, sodales a, feugiat ut, commodo sit amet, mauris. Sed non mi eu dolor sollicitudin rhoncus. Nunc elit. Nunc fringilla enim in libero sollicitudin varius. Sed pellentesque enim vel turpis. Aenean eget risus. Aliquam interdum hendrerit urna. Sed tincidunt varius metus. In interdum. In non tellus in nibh suscipit lobortis. Vivamus gravida erat at dolor. Donec dolor dui, faucibus at, rhoncus vitae, lobortis eget, quam. Proin turpis. <br/><br/> Nunc nibh. Phasellus sem pede, tristique ac, tincidunt et, laoreet non, nisl. Integer consequat tincidunt sapien. Donec vitae nisi eget enim tempus elementum. Nullam feugiat adipiscing velit. Duis diam. Curabitur dictum lectus ut felis. Fusce eros mauris, dapibus quis, facilisis et, posuere id, urna. In hac habitasse platea dictumst. Duis purus quam, ullamcorper elementum, suscipit ut, congue et, libero. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec facilisis. Suspendisse a risus sit amet nunc sollicitudin vestibulum. Vivamus dui. Ut hendrerit ipsum non velit. Donec quis erat. Vestibulum eget justo eu diam feugiat varius. Sed eu odio. Aenean sed justo. Nunc porttitor est pretium dui. <br/><br/> Ut sit amet urna. Curabitur nulla odio, varius non, sollicitudin in, varius sagittis, felis. Integer libero lacus, tincidunt ac, blandit at, facilisis non, ligula. Phasellus ullamcorper, justo vitae mattis sodales, tortor magna placerat mi, non condimentum lacus risus eu nisi. Morbi in turpis sit amet tortor aliquam interdum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam ac velit et ligula convallis viverra. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Praesent consequat. Proin dictum metus nec risus. Suspendisse commodo dui vel purus. Donec rutrum, quam a euismod malesuada, sem dui adipiscing lacus, et euismod sapien ante a tellus. Sed vulputate nisl in diam. Nam odio ipsum, aliquet a, bibendum at, sagittis eget, quam. Sed vehicula. In massa. Vivamus dolor massa, pretium ut, tempor eget, porta vitae, leo. Vivamus ac magna. Sed dolor. <br/> <center><b>Do <u>not</u> remove the following credit!</b></center> <br/><br/> <center><img src="http://img5.imageshack.us/img5/4625/creditfx0.png" alt="#" /></center> <br/><br/><br/> </div> ]]> </textarea> <br/><a href="http://i42.tinypic.com/o8tr1j.jpg" rel="facebox">Grey Dots</a> <br/><textarea rows="20" cols="20"> <![CDATA[ <style> body{ background-image:url(http://img18.imageshack.us/img18/7100/dots2bg4.jpg); background-repeat:repeat-y; background-color:#606060; } body,table,td,tr,p{ color:#000000; font-size:10px; font-family:verdana; line-height:15px; } h1{ font-family:century gothic, georgia; font-size:20px; line-height:25px; color:#606060; border-bottom:2px dashed #606060; text-align:right; } h2{ font-family:century gothic, georgia; font-size:20px; line-height:25px; color:#606060; border-bottom:2px dashed #606060; text-align:left; } b{ color:#606060; } i{ color:#707070; font-style:italic; } u{ color:#707070; border-bottom:1px dashed #606060; text-decoration:none; } a:link,a:visited,a:active{ color:#606060; font-weight:bold; border-bottom:1px dashed #606060; text-decoration:none; } a:hover{ color:#707070; text-decoration:none; font-weight:normal; } #text{ position:absolute; left:50px; top:150px; width:400px; overflow:auto; } #image{ position:absolute; top:0px; left:0px; } </style> <div ID="image"> <img src="http://img12.imageshack.us/img12/2476/dotscd2.jpg alt="#" /> </div> <div ID="text"> <h1>Header</h1> <b>Bold</b> <i>italic</i> <u>underlined</u> <a href="#">link</a>, consectetur adipiscing elit. Vivamus ac nulla ac lectus elementum tincidunt. Nulla facilisi. Vestibulum lobortis. Mauris interdum mauris sit amet ligula. Proin ante. Vivamus sed nunc et lectus feugiat eleifend. Nam elit mi, viverra quis, iaculis sit amet, volutpat at, lacus. Nunc velit nibh, laoreet ut, cursus eget, feugiat ac, diam. Morbi mollis massa. Proin id augue. Sed facilisis massa at lacus. Ut eget leo. Nunc porta diam sed eros. <br/><br/> Pellentesque et nisi. Morbi dignissim lectus ut erat. Mauris euismod, diam nec bibendum lobortis, sem metus luctus purus, et aliquet nunc justo gravida arcu. Nulla dignissim ante suscipit orci. Vivamus justo dui, tempor sed, eleifend non, placerat in, risus. Vestibulum facilisis libero a eros. Vivamus quis elit nec neque eleifend malesuada. Integer luctus, mi ut posuere egestas, mauris tortor dictum leo, non sollicitudin nulla ligula vel risus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi suscipit mauris id purus. Vestibulum diam purus, mollis et, porta at, vehicula sit amet, eros. Aliquam sem. Vestibulum ante. Quisque eget dui a leo condimentum sollicitudin. <h2>Header(2)</h2> Mauris placerat elit vel lectus. Mauris aliquet, purus nec luctus vehicula, enim orci tristique libero, et iaculis tortor urna a erat. Donec blandit quam nec odio. Nunc ipsum. Suspendisse varius eros at ligula. Sed sit amet massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque odio ipsum, sodales a, feugiat ut, commodo sit amet, mauris. Sed non mi eu dolor sollicitudin rhoncus. Nunc elit. Nunc fringilla enim in libero sollicitudin varius. Sed pellentesque enim vel turpis. Aenean eget risus. Aliquam interdum hendrerit urna. Sed tincidunt varius metus. In interdum. In non tellus in nibh suscipit lobortis. Vivamus gravida erat at dolor. Donec dolor dui, faucibus at, rhoncus vitae, lobortis eget, quam. Proin turpis. <br/><br/> Nunc nibh. Phasellus sem pede, tristique ac, tincidunt et, laoreet non, nisl. Integer consequat tincidunt sapien. Donec vitae nisi eget enim tempus elementum. Nullam feugiat adipiscing velit. Duis diam. Curabitur dictum lectus ut felis. Fusce eros mauris, dapibus quis, facilisis et, posuere id, urna. In hac habitasse platea dictumst. Duis purus quam, ullamcorper elementum, suscipit ut, congue et, libero. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec facilisis. Suspendisse a risus sit amet nunc sollicitudin vestibulum. Vivamus dui. Ut hendrerit ipsum non velit. Donec quis erat. Vestibulum eget justo eu diam feugiat varius. Sed eu odio. Aenean sed justo. Nunc porttitor est pretium dui. <br/><br/> Ut sit amet urna. Curabitur nulla odio, varius non, sollicitudin in, varius sagittis, felis. Integer libero lacus, tincidunt ac, blandit at, facilisis non, ligula. Phasellus ullamcorper, justo vitae mattis sodales, tortor magna placerat mi, non condimentum lacus risus eu nisi. Morbi in turpis sit amet tortor aliquam interdum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam ac velit et ligula convallis viverra. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Praesent consequat. Proin dictum metus nec risus. Suspendisse commodo dui vel purus. Donec rutrum, quam a euismod malesuada, sem dui adipiscing lacus, et euismod sapien ante a tellus. Sed vulputate nisl in diam. Nam odio ipsum, aliquet a, bibendum at, sagittis eget, quam. Sed vehicula. In massa. Vivamus dolor massa, pretium ut, tempor eget, porta vitae, leo. Vivamus ac magna. Sed dolor. <br/> <center><b>Do <u>not</u> remove the following credit!</b></center> <br/><br/> <center><img src="http://img5.imageshack.us/img5/4625/creditfx0.png" alt="#" /></center> <br/><br/><br/> </div> ]]> </textarea> <br/><a href="http://i41.tinypic.com/2mo860k.jpg" rel="facebox">Red Hearts</a> <br/><textarea rows="20" cols="20"> <![CDATA[ <style> body{ background-image:url(http://img16.imageshack.us/img16/1350/hearts2cq9.jpg); background-repeat:repeat-y; background-color:#B91607; } body,table,td,tr,p{ color:#000000; font-size:10px; font-family:verdana; line-height:15px; } h1{ font-family:century gothic, georgia; font-size:20px; line-height:25px; color:#B91607; border-bottom:2px dashed #B91607; text-align:right; } h2{ font-family:century gothic, georgia; font-size:20px; line-height:25px; color:#B91607; border-bottom:2px dashed #B91607; text-align:left; } b{ color:#B91607; } i{ color:#C23023; font-style:italic; } u{ color:#C23023; border-bottom:1px dashed #B91607; text-decoration:none; } a:link,a:visited,a:active{ color:#B91607; font-weight:bold; border-bottom:1px dashed #B91607; text-decoration:none; } a:hover{ color:#C23023; text-decoration:none; font-weight:normal; } #text{ position:absolute; left:50px; top:150px; width:400px; overflow:auto; } #image{ position:absolute; top:0px; left:0px; } </style> <div ID="image"> <img src="http://img8.imageshack.us/img8/9493/heartslt7.jpg" alt="#" /> </div> <div ID="text"> <h1>Header</h1> <b>Bold</b> <i>italic</i> <u>underlined</u> <a href="#">link</a>, consectetur adipiscing elit. Vivamus ac nulla ac lectus elementum tincidunt. Nulla facilisi. Vestibulum lobortis. Mauris interdum mauris sit amet ligula. Proin ante. Vivamus sed nunc et lectus feugiat eleifend. Nam elit mi, viverra quis, iaculis sit amet, volutpat at, lacus. Nunc velit nibh, laoreet ut, cursus eget, feugiat ac, diam. Morbi mollis massa. Proin id augue. Sed facilisis massa at lacus. Ut eget leo. Nunc porta diam sed eros. <br/><br/> Pellentesque et nisi. Morbi dignissim lectus ut erat. Mauris euismod, diam nec bibendum lobortis, sem metus luctus purus, et aliquet nunc justo gravida arcu. Nulla dignissim ante suscipit orci. Vivamus justo dui, tempor sed, eleifend non, placerat in, risus. Vestibulum facilisis libero a eros. Vivamus quis elit nec neque eleifend malesuada. Integer luctus, mi ut posuere egestas, mauris tortor dictum leo, non sollicitudin nulla ligula vel risus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi suscipit mauris id purus. Vestibulum diam purus, mollis et, porta at, vehicula sit amet, eros. Aliquam sem. Vestibulum ante. Quisque eget dui a leo condimentum sollicitudin. <h2>Header(2)</h2> Mauris placerat elit vel lectus. Mauris aliquet, purus nec luctus vehicula, enim orci tristique libero, et iaculis tortor urna a erat. Donec blandit quam nec odio. Nunc ipsum. Suspendisse varius eros at ligula. Sed sit amet massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque odio ipsum, sodales a, feugiat ut, commodo sit amet, mauris. Sed non mi eu dolor sollicitudin rhoncus. Nunc elit. Nunc fringilla enim in libero sollicitudin varius. Sed pellentesque enim vel turpis. Aenean eget risus. Aliquam interdum hendrerit urna. Sed tincidunt varius metus. In interdum. In non tellus in nibh suscipit lobortis. Vivamus gravida erat at dolor. Donec dolor dui, faucibus at, rhoncus vitae, lobortis eget, quam. Proin turpis. <br/><br/> Nunc nibh. Phasellus sem pede, tristique ac, tincidunt et, laoreet non, nisl. Integer consequat tincidunt sapien. Donec vitae nisi eget enim tempus elementum. Nullam feugiat adipiscing velit. Duis diam. Curabitur dictum lectus ut felis. Fusce eros mauris, dapibus quis, facilisis et, posuere id, urna. In hac habitasse platea dictumst. Duis purus quam, ullamcorper elementum, suscipit ut, congue et, libero. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec facilisis. Suspendisse a risus sit amet nunc sollicitudin vestibulum. Vivamus dui. Ut hendrerit ipsum non velit. Donec quis erat. Vestibulum eget justo eu diam feugiat varius. Sed eu odio. Aenean sed justo. Nunc porttitor est pretium dui. <br/><br/> Ut sit amet urna. Curabitur nulla odio, varius non, sollicitudin in, varius sagittis, felis. Integer libero lacus, tincidunt ac, blandit at, facilisis non, ligula. Phasellus ullamcorper, justo vitae mattis sodales, tortor magna placerat mi, non condimentum lacus risus eu nisi. Morbi in turpis sit amet tortor aliquam interdum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam ac velit et ligula convallis viverra. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Praesent consequat. Proin dictum metus nec risus. Suspendisse commodo dui vel purus. Donec rutrum, quam a euismod malesuada, sem dui adipiscing lacus, et euismod sapien ante a tellus. Sed vulputate nisl in diam. Nam odio ipsum, aliquet a, bibendum at, sagittis eget, quam. Sed vehicula. In massa. Vivamus dolor massa, pretium ut, tempor eget, porta vitae, leo. Vivamus ac magna. Sed dolor. <br/> <center><b>Do <u>not</u> remove the following credit!</b></center> <br/><br/> <center><img src="http://img5.imageshack.us/img5/4625/creditfx0.png" alt="#" /></center> <br/><br/><br/> </div> ]]> </textarea> <br/><a href="http://i39.tinypic.com/10h6l8g.jpg" rel="facebox">Purple Butterflies</a> <br/><textarea rows="20" cols="20"> <![CDATA[ <style> body{ background-image:url(http://img7.imageshack.us/img7/2812/butterfly2ld9.jpg); background-repeat:repeat-y; background-color:#B9068A; } body,table,td,tr,p{ color:#000000; font-size:10px; font-family:verdana; line-height:15px; } h1{ font-family:century gothic, georgia; font-size:20px; line-height:25px; color:#B9068A; border-bottom:2px dashed #B9068A; text-align:right; } h2{ font-family:century gothic, georgia; font-size:20px; line-height:25px; color:#B9068A; border-bottom:2px dashed #B9068A; text-align:left; } b{ color:#B9068A; } i{ color:#AA1B82; font-style:italic; } u{ color:#AA1B82; border-bottom:1px dashed #B9068A; text-decoration:none; } a:link,a:visited,a:active{ color:#B9068A; font-weight:bold; border-bottom:1px dashed #B9068A; text-decoration:none; } a:hover{ color:#AA1B82; text-decoration:none; font-weight:normal; } #text{ position:absolute; left:50px; top:150px; width:400px; overflow:auto; } #image{ position:absolute; top:0px; left:0px; } </style> <div ID="image"> <img src="http://img18.imageshack.us/img18/4706/butterflydu7.jpg" alt="#" /> </div> <div ID="text"> <h1>Header</h1> <b>Bold</b> <i>italic</i> <u>underlined</u> <a href="#">link</a>, consectetur adipiscing elit. Vivamus ac nulla ac lectus elementum tincidunt. Nulla facilisi. Vestibulum lobortis. Mauris interdum mauris sit amet ligula. Proin ante. Vivamus sed nunc et lectus feugiat eleifend. Nam elit mi, viverra quis, iaculis sit amet, volutpat at, lacus. Nunc velit nibh, laoreet ut, cursus eget, feugiat ac, diam. Morbi mollis massa. Proin id augue. Sed facilisis massa at lacus. Ut eget leo. Nunc porta diam sed eros. <br/><br/> Pellentesque et nisi. Morbi dignissim lectus ut erat. Mauris euismod, diam nec bibendum lobortis, sem metus luctus purus, et aliquet nunc justo gravida arcu. Nulla dignissim ante suscipit orci. Vivamus justo dui, tempor sed, eleifend non, placerat in, risus. Vestibulum facilisis libero a eros. Vivamus quis elit nec neque eleifend malesuada. Integer luctus, mi ut posuere egestas, mauris tortor dictum leo, non sollicitudin nulla ligula vel risus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi suscipit mauris id purus. Vestibulum diam purus, mollis et, porta at, vehicula sit amet, eros. Aliquam sem. Vestibulum ante. Quisque eget dui a leo condimentum sollicitudin. <h2>Header(2)</h2> Mauris placerat elit vel lectus. Mauris aliquet, purus nec luctus vehicula, enim orci tristique libero, et iaculis tortor urna a erat. Donec blandit quam nec odio. Nunc ipsum. Suspendisse varius eros at ligula. Sed sit amet massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque odio ipsum, sodales a, feugiat ut, commodo sit amet, mauris. Sed non mi eu dolor sollicitudin rhoncus. Nunc elit. Nunc fringilla enim in libero sollicitudin varius. Sed pellentesque enim vel turpis. Aenean eget risus. Aliquam interdum hendrerit urna. Sed tincidunt varius metus. In interdum. In non tellus in nibh suscipit lobortis. Vivamus gravida erat at dolor. Donec dolor dui, faucibus at, rhoncus vitae, lobortis eget, quam. Proin turpis. <br/><br/> Nunc nibh. Phasellus sem pede, tristique ac, tincidunt et, laoreet non, nisl. Integer consequat tincidunt sapien. Donec vitae nisi eget enim tempus elementum. Nullam feugiat adipiscing velit. Duis diam. Curabitur dictum lectus ut felis. Fusce eros mauris, dapibus quis, facilisis et, posuere id, urna. In hac habitasse platea dictumst. Duis purus quam, ullamcorper elementum, suscipit ut, congue et, libero. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec facilisis. Suspendisse a risus sit amet nunc sollicitudin vestibulum. Vivamus dui. Ut hendrerit ipsum non velit. Donec quis erat. Vestibulum eget justo eu diam feugiat varius. Sed eu odio. Aenean sed justo. Nunc porttitor est pretium dui. <br/><br/> Ut sit amet urna. Curabitur nulla odio, varius non, sollicitudin in, varius sagittis, felis. Integer libero lacus, tincidunt ac, blandit at, facilisis non, ligula. Phasellus ullamcorper, justo vitae mattis sodales, tortor magna placerat mi, non condimentum lacus risus eu nisi. Morbi in turpis sit amet tortor aliquam interdum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam ac velit et ligula convallis viverra. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Praesent consequat. Proin dictum metus nec risus. Suspendisse commodo dui vel purus. Donec rutrum, quam a euismod malesuada, sem dui adipiscing lacus, et euismod sapien ante a tellus. Sed vulputate nisl in diam. Nam odio ipsum, aliquet a, bibendum at, sagittis eget, quam. Sed vehicula. In massa. Vivamus dolor massa, pretium ut, tempor eget, porta vitae, leo. Vivamus ac magna. Sed dolor. <br/> <center><b>Do <u>not</u> remove the following credit!</b></center> <br/><br/> <center><img src="http://img5.imageshack.us/img5/4625/creditfx0.png" alt="#" /></center> <br/><br/><br/> </div> ]]> </textarea> <br/><a href="http://i42.tinypic.com/imnqs2.jpg" rel="facebox">Orange Flowers</a> <br/><textarea rows="20" cols="20"> <![CDATA[ <style> body{ background-image:url(http://img21.imageshack.us/img21/6599/flower2xh7.jpg); background-repeat:repeat-y; background-color:#B97006; } body,table,td,tr,p{ color:#000000; font-size:10px; font-family:verdana; line-height:15px; } h1{ font-family:century gothic, georgia; font-size:20px; line-height:25px; color:#B97006; border-bottom:2px dashed #B97006; text-align:right; } h2{ font-family:century gothic, georgia; font-size:20px; line-height:25px; color:#B97006; border-bottom:2px dashed #B97006; text-align:left; } b{ color:#B97006; } i{ color:#BF801F; font-style:italic; } u{ color:#BF801F; border-bottom:1px dashed #B97006; text-decoration:none; } a:link,a:visited,a:active{ color:#B97006; font-weight:bold; border-bottom:1px dashed #B97006; text-decoration:none; } a:hover{ color:#BF801F; text-decoration:none; font-weight:normal; } #text{ position:absolute; left:50px; top:150px; width:400px; overflow:auto; } #image{ position:absolute; top:0px; left:0px; } </style> <div ID="image"> <img src="http://img13.imageshack.us/img13/3091/flowerfd0.jpg" alt="#" /> </div> <div ID="text"> <h1>Header</h1> <b>Bold</b> <i>italic</i> <u>underlined</u> <a href="#">link</a>, consectetur adipiscing elit. Vivamus ac nulla ac lectus elementum tincidunt. Nulla facilisi. Vestibulum lobortis. Mauris interdum mauris sit amet ligula. Proin ante. Vivamus sed nunc et lectus feugiat eleifend. Nam elit mi, viverra quis, iaculis sit amet, volutpat at, lacus. Nunc velit nibh, laoreet ut, cursus eget, feugiat ac, diam. Morbi mollis massa. Proin id augue. Sed facilisis massa at lacus. Ut eget leo. Nunc porta diam sed eros. <br/><br/> Pellentesque et nisi. Morbi dignissim lectus ut erat. Mauris euismod, diam nec bibendum lobortis, sem metus luctus purus, et aliquet nunc justo gravida arcu. Nulla dignissim ante suscipit orci. Vivamus justo dui, tempor sed, eleifend non, placerat in, risus. Vestibulum facilisis libero a eros. Vivamus quis elit nec neque eleifend malesuada. Integer luctus, mi ut posuere egestas, mauris tortor dictum leo, non sollicitudin nulla ligula vel risus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi suscipit mauris id purus. Vestibulum diam purus, mollis et, porta at, vehicula sit amet, eros. Aliquam sem. Vestibulum ante. Quisque eget dui a leo condimentum sollicitudin. <h2>Header(2)</h2> Mauris placerat elit vel lectus. Mauris aliquet, purus nec luctus vehicula, enim orci tristique libero, et iaculis tortor urna a erat. Donec blandit quam nec odio. Nunc ipsum. Suspendisse varius eros at ligula. Sed sit amet massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque odio ipsum, sodales a, feugiat ut, commodo sit amet, mauris. Sed non mi eu dolor sollicitudin rhoncus. Nunc elit. Nunc fringilla enim in libero sollicitudin varius. Sed pellentesque enim vel turpis. Aenean eget risus. Aliquam interdum hendrerit urna. Sed tincidunt varius metus. In interdum. In non tellus in nibh suscipit lobortis. Vivamus gravida erat at dolor. Donec dolor dui, faucibus at, rhoncus vitae, lobortis eget, quam. Proin turpis. <br/><br/> Nunc nibh. Phasellus sem pede, tristique ac, tincidunt et, laoreet non, nisl. Integer consequat tincidunt sapien. Donec vitae nisi eget enim tempus elementum. Nullam feugiat adipiscing velit. Duis diam. Curabitur dictum lectus ut felis. Fusce eros mauris, dapibus quis, facilisis et, posuere id, urna. In hac habitasse platea dictumst. Duis purus quam, ullamcorper elementum, suscipit ut, congue et, libero. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec facilisis. Suspendisse a risus sit amet nunc sollicitudin vestibulum. Vivamus dui. Ut hendrerit ipsum non velit. Donec quis erat. Vestibulum eget justo eu diam feugiat varius. Sed eu odio. Aenean sed justo. Nunc porttitor est pretium dui. <br/><br/> Ut sit amet urna. Curabitur nulla odio, varius non, sollicitudin in, varius sagittis, felis. Integer libero lacus, tincidunt ac, blandit at, facilisis non, ligula. Phasellus ullamcorper, justo vitae mattis sodales, tortor magna placerat mi, non condimentum lacus risus eu nisi. Morbi in turpis sit amet tortor aliquam interdum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam ac velit et ligula convallis viverra. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Praesent consequat. Proin dictum metus nec risus. Suspendisse commodo dui vel purus. Donec rutrum, quam a euismod malesuada, sem dui adipiscing lacus, et euismod sapien ante a tellus. Sed vulputate nisl in diam. Nam odio ipsum, aliquet a, bibendum at, sagittis eget, quam. Sed vehicula. In massa. Vivamus dolor massa, pretium ut, tempor eget, porta vitae, leo. Vivamus ac magna. Sed dolor. <br/> <center><b>Do <u>not</u> remove the following credit!</b></center> <br/><br/> <center><img src="http://img5.imageshack.us/img5/4625/creditfx0.png" alt="#" /></center> <br/><br/><br/> </div> ]]> </textarea> <br/><br/> </div> </div> <div style="position:absolute;top:735px;left:200px;"> <a href="http://www.freedomain.co.nr/" target="_blank"> <img src="http://nezmosa.ne.com.ru/animg7.gif" width="88" height="31" border="0" alt="Free Domain Name Address" /></a> </div> <div id="cbox"> <table width="1000" border="0"> <!-- BEGIN CBOX - www.cbox.ws - v001 --> <div id="cboxdiv" style="text-align: center; line-height: 0"> <div><iframe frameborder="0" width="530" height="75" src="http://www2.cbox.ws/box/?boxid=1783514&boxtag=ebvnzr&sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform" style="border:#000000 1px solid;border-bottom:0px" id="cboxform"></iframe></div> <div><iframe frameborder="0" width="530" height="153" src="http://www2.cbox.ws/box/?boxid=1783514&boxtag=ebvnzr&sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain" style="border:#000000 1px solid;" id="cboxmain"></iframe></div> </div> <!-- END CBOX --> <form><input type='button' value='View our Affilates & Partners' onClick="java script:Affies()"></form> <script language="JavaScript"> function Affies(){ myleft=(screen.width)?(screen.width-500)/2:100;mytop=(screen.height)?(screen.height-400)/2:100; settings='top=' + mytop + ',left=' + myleft + ',width=500,height=300,location=no,directories=no,menubar=no,toolbar=no,statu s=no,scrollbars=no,resizable=no,fullscreen=no' Affies=window.open('/home/www/onyx-dragon.emporers-village-neo.net/sitely/affies.php','Affies', settings); } </script> </td> </tr> </table> </div> </body> </html> It's a start atleast...
February 28, 200917 yr Author Thanks a lot! I shall change it to that and see where I can go from there... Edit-- So I changed the code to the one above, and now the tabs are on top of each other. Also the "<![CDATA[" stuff appears in the textarea--Is that supposed to happen? 'Nother Edit-- I was looking at the doctype--Is it for XHMTL or HTML? As far as I know I think I should be using a HTML one.
February 28, 200917 yr Try <textarea rows="20" cols="20"> <!--<![CDATA[--> Content here <!--]]>--> </textarea> I never looked at it, i just cleaned up some of the errors, chances are you were rendering in quirks mode. You should put all your css in an external stylesheet (it's easier to manage). I'll take another look... ... i can't access it, just times out.
February 28, 200917 yr Author I tried on the first textarea and it still shows. If you can answer these questions, then I will put it on an external page. I just haven't been able to figure out how yet. -Do you put style tags on the stylesheet page? -In the rest of the page's code if the thingamajig you write, <link rel="URL"> or is there something more? It should load eventually, it works for me.
February 28, 200917 yr <link rel='stylesheet' type='text/css' media='all' href="css/style.css" /> just put the filepath in the href="" tag. Media, can be used to specify alternate stylesheets for printing, and other mediums.
Create an account or sign in to comment