|
HTML - Unable To Center <div>.
I created my website in photoshop and sliced it up and exported it as HTML/Images so it would be coded in CSS and with div tags. But I am unable to center my website as a whole. If I export them as a table I can center it easily (Here is my site in tables.), but no one really like tables and I would much prefer it in CSS and with div tags.
Here's the site when coded with CSS. HTML Code: <html>
<head>
<title>Linnit</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<!-- Save for Web Styles (Linnit.psd) -->
<style type="text/css">
<!--
#Table_01 {
position:relative; right:50px
left:0px;
top:0px;
width:950px;
height:1250px;
padding-left: 200em;
}
#index-01 {
position:absolute;
left:0px;
top:0px;
width:950px;
height:14px;
}
#index-02 {
position:absolute;
left:0px;
top:14px;
width:198px;
height:1236px;
}
#Logo {
position:absolute;
left:198px;
top:14px;
width:175px;
height:87px;
}
#index-04 {
position:absolute;
left:373px;
top:14px;
width:392px;
height:87px;
}
#index-05 {
position:absolute;
left:765px;
top:14px;
width:185px;
height:1236px;
}
#index-06 {
position:absolute;
left:198px;
top:101px;
width:567px;
height:6px;
}
#Left-Nav {
position:absolute;
left:198px;
top:107px;
width:232px;
height:60px;
}
#index-08 {
position:absolute;
left:430px;
top:107px;
width:6px;
height:60px;
}
#Home {
position:absolute;
left:436px;
top:107px;
width:55px;
height:60px;
}
#About {
position:absolute;
left:491px;
top:107px;
width:47px;
height:60px;
}
#Linnit {
position:absolute;
left:538px;
top:107px;
width:52px;
height:60px;
}
#Contact {
position:absolute;
left:590px;
top:107px;
width:65px;
height:60px;
}
#index-13 {
position:absolute;
left:655px;
top:107px;
width:55px;
height:60px;
}
#Other {
position:absolute;
left:710px;
top:107px;
width:55px;
height:60px;
}
#index-15 {
position:absolute;
left:198px;
top:167px;
width:567px;
height:6px;
}
#Main {
position:absolute;
left:198px;
top:173px;
width:468px;
height:232px;
}
#index-17 {
position:absolute;
left:666px;
top:173px;
width:6px;
height:232px;
}
#Right {
position:absolute;
left:672px;
top:173px;
width:93px;
height:232px;
}
#index-19 {
position:absolute;
left:198px;
top:405px;
width:567px;
height:845px;
}
-->
</style>
<!-- End Save for Web Styles -->
</head>
<body style="background-color:#FFFFFF; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;">
<!-- Save for Web Slices (something.psd) -->
<div id="Table_01">
<div id="index-01">
<img src="images/index_01.gif" width="950" height="14" alt="">
</div>
<div id="index-02">
<img src="images/index_02.gif" width="198" height="1236" alt="">
</div>
<div id="Logo">
<a href="index.html">
<img src="images/Logo.gif" width="175" height="87" border="0" alt="Logo"></a>
</div>
<div id="index-04">
<img src="images/index_04.gif" width="392" height="87" alt="">
</div>
<div id="index-05">
<img src="images/index_05.gif" width="185" height="1236" alt="">
</div>
<div id="index-06">
<img src="images/index_06.gif" width="567" height="6" alt="">
</div>
<div id="Left-Nav">
<img src="images/Left_Nav.gif" width="232" height="60" alt="">
</div>
<div id="index-08">
<img src="images/index_08.gif" width="6" height="60" alt="">
</div>
<div id="Home">
<a href="index.html">
<img src="images/Home.gif" width="55" height="60" border="0" alt=""></a>
</div>
<div id="About">
<a href="about.html">
<img src="images/About.gif" width="47" height="60" border="0" alt=""></a>
</div>
<div id="Linnit">
<a href="linnit.html">
<img src="images/Linnit.gif" width="52" height="60" border="0" alt=""></a>
</div>
<div id="Contact">
<a href="contact.html">
<img src="images/Contact.gif" width="65" height="60" border="0" alt=""></a>
</div>
<div id="index-13">
<img src="images/index_13.gif" width="55" height="60" alt="">
</div>
<div id="Other">
<a href="other.html">
<img src="images/Other.gif" width="55" height="60" border="0" alt=""></a>
</div>
<div id="index-15">
<img src="images/index_15.gif" width="567" height="6" alt="">
</div>
<div id="Main">
<img src="images/Main.gif" width="468" height="232" alt="">
</div>
<div id="index-17">
<img src="images/index_17.gif" width="6" height="232" alt="">
</div>
<div id="Right">
<img src="images/Right.gif" width="93" height="232" alt="">
</div>
<div id="index-19">
<img src="images/index_19.gif" width="567" height="845" alt="">
</div>
</div>
<!-- End Save for Web Slices -->
</body>
</html>
Similar TutorialsI just put up a flash banner and below it are the html links (incase someone doesn't want to dl the plugin) and it worked in IE6 but not in Firefox I don't know the reason why, I do see it in the source for FF but it's not showing. I also cleared cache but still don't see it. my site's at www.PTSgirl.com ..am I the only one who doesnt see it in firefox?? thanks in advance! hi. i am developing a web application which includes tree view on left hand side and a table on right hand side which displays information if i clicked on any leaf of tree. This is the concept, i hv created view but unable to show information in right pane if i am gng to click on any link in tree view. Please help me Hi guys, hello to all and thank you for letting me be apart of this forum! Im having some problems with a new site i have published and kind of need some solutions to my my problems if at all possible! My current situation is that i have subscribed to streamline.net,buit my new shopping site in their site wizard program and have published it on the web,all is hunky dorry upto now. I have adjusted certain aspects of the design via Dreamweaver and even published some affiliate logos/adverts on my home page by copy and pasting the HTML codes and saving into my FTP files and have added a small piece of music on the opening welcome page. Now, i have signed up with Google Checkout and also Paypal Checkout and i am unable to copy and paste their associated 'Add to basket' buttons onto my item lists.I can copy the buttons to other parts of the site like the disclaimer page but just cant seem to copy them to my item description boxes. My thinking is its down to me using a template form to enter my item descriptions in site wizard. Another strange thing i have noticed is that i can't seem to find the item description text in my FTP files only the pictures product ID ,name and price. I am in the process of trying to sort out my problem with streamline via email but is slow going,i just thought you guys could shed some light onto my problems. Any help at all would me much appreciated!!!!! my site is on line at www.designerswitching.co.uk . Kind regards , James I am createing HTML page in notepad++ some code is here. My problem is , i would like to apply the same formatting to each <td> without using <p> how to do it please reply. <html> <head> <title>Policy</title> <style> how to write style style here? </style> </head> <body lang=EN-US link=blue vlink=purple> <table border=0 width=100% height=100% cellpadding=10 cellspacing=0> <tr > <td > <p style='margin-left:30%;'> <img width=332 height=144 src="ftp_files/image001.jpg"> </p> </td> </tr> <tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr> <tr> <td > <p style='font-size:26.0pt;font-family:Arial;margin-left:25%;'>Foreign Travel Policy &Procedures</p> </td> </tr> <tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr> <tr> <td> <p style='font-size:26.0pt;font-family:Arial;margin-left:40%;'>Version 1.1</p> </td> </tr> <tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr> <tr> <td> <p style='font-size:12.0pt;font-family:Arial;margin-left:5%'><b>Document Version Control<b></p> </td> </tr> <tr> <td> <table border=1 cellspacing=0 cellpadding=3 width=568 style='margin-left:5%;background:silver;border-collapse:collapse;'> <tr> <td> <p style='font-size:10.0pt;font-family:Arial;text-align:center'>SR. No.</p> </td> <td> <p style='font-size:10.0pt;font-family:Arial;text-align:center'>Date</b></p> </td> <td > <p style='font-size:10.0pt;font-family:Arial;text-align:center'>Description/Comments</b></p> </td> <td> <p style='font-size:10.0pt;font-family:Arial;text-align:center'>Submitted by</b></p> </td> </tr> <tr style='background:white'> <td><p style='font-size:10.0pt;font-family:Arial;text-align:center'>1</p> </td> <td><p style='font-size:10.0pt;font-family:Arial;text-align:center'>22 October 2007</span></p> </td> <td ><p style='font-size:10.0pt;font-family:Arial;text-align:center'>Initial draft on Foreign Travel Policy & Procedures</span></p> </td> <td><p style='font-size:10.0pt;font-family:Arial;text-align:center'>Gianfranco Di Bonaventura</span></p> </td> </tr> <tr style='background:white'> <td ><p style='font-size:10.0pt;font-family:Arial;text-align:center'>2</span></p> </td> <td> <p style='font-size:10.0pt;font-family:Arial;text-align:center'>1st November 2008</p> </td> <td><p style='font-size:10.0pt;font-family:Arial;text-align:center'>Review on Foreign Travel Policy & Procedures</p> </td> <td><p style='font-size:10.0pt;font-family:Arial;text-align:center'>Gianfranco Di Bonaventura</p> </td> </tr> <tr style='background:white'> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr style='background:white'> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr style='background:white'> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr style='background:white'> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr style='background:white'> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr style='background:white'> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr style='background:white'> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr style='background:white'> <td> </td> <td> </td> <td> </td> <td> </td> </tr> </table> </td> </tr> <tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr> <tr> <td> <b><p style='font-size:10.0pt;font-family:Arial;margin-left:5%'> Authorized Signatory</b> </td> </tr> <tr> <td> <b><p style='font-size:10.0pt;font-family:Arial;margin-left:5%'>On behalf of Arjuna IT Solutions Pvt. Ltd.</b> </td> </tr> <tr> <td> <b><p style='font-size:10.0pt;font-family:Arial;margin-left:5%'>Gianfranco Di Bonaventura </b> </td> </tr> <tr> <td> <b><p style='font-size:10.0pt;font-family:Arial;margin-left:5%'>( Managing Director ) </b> </td> </tr> <tr> <td> <b><p style='font-size:10.0pt;font-family:Arial;margin-left:5%'>Sign: </b> </td> </tr> <tr> <td> <b><p style='font-size:10.0pt;font-family:Arial;margin-left:5%'>Date:</b> </td> </tr> <tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr> <tr> <td> <b><p style='font-size:10.0pt;font-family:Arial;margin-left:5%'>Table Of Contents</b> </td> </tr> <tr> <td><b><p style='font-size:10.0pt;font-family:Arial;margin-left:5%'>Objective................................................................................. </td> </tr> <tr> <td><b><p style='font-size:10.0pt;font-family:Arial;margin-left:5%'>Scope..................................................................................... </td> </tr> <tr> <td><b><p style='font-size:10.0pt;font-family:Arial;margin-left:5%'>Procedure................................................................................. </td> </tr> <tr> <td><p style='font-size:9.0pt;font-family:Arial;margin-left:8%'>PLANNING................................................................................... </td> </tr> <tr> <td><p style='font-size:9.0pt;font-family:Arial;margin-left:8%'>Travel Checklist........................................................................... </td> </tr> <tr> <td><p style='font-size:9.0pt;font-family:Arial;margin-left:8%'>Travel Budget.............................................................................. </td> </tr> <tr> <td><p style='font-size:9.0pt;font-family:Arial;margin-left:8%'>Expense Maintenance Sheet ................................................................. </td> </tr> <tr> <td><b><p style='font-size:9.0pt;font-family:Arial;margin-left:5%'>Attachment................................................................................. </td> </tr> <tr> <td> </td> </tr> </table> </body> </html> i've designed my page as: HTML Code: <div class="yesVisible" id="loginFormDiv" name="loginFormDiv">
<form method="get" id="loginForm" name="loginForm" onsubmit="validate(this)" >
<input type="text" size="10 />
<img src="login.gif" name="loginImg" id="loginImg" />
</form>
</div>
And the validator function is as follows: Code: function validate(form)
{
var v= document.getElementById("loginFormDiv");
// print a line saying loggin in and show an icon in the login div
v.innerHTML=" <h1> loging in... </h1>" + "<img src=\"loadin.gif\" />"
alert("validating");
// later other ajax code will be here
return false;
}
But unfortunately this code is not working...........What should i do ???? This code is intended to let users a feeling that they are loggin in...... The website will be made for: http://www.favourite9site.com/blog Hey guys. I don't know if I'm not using the correct data type, but I can't seem to get this audio file to play when I run my startTimer function. Any suggestions? Thank you! <!DOCTYPE html> <head> <script type="text/javascript"> var c = 0; var T; var a = 1000; var b; //var audio = document.createElement('asharpdot1'); //audioElement.setAttribute('audio', 'loading.wav'); //audioElement.play(); function startTimer(){ c = c+1 document.getElementById('myText').innerHTML=c; function Music(){ document.getElementById('asharpdot').audioElement.play(); } if(c<4){ T = setTimeout("startTimer()", a); //document.getElementById('myText').innerHTML=c; } else { c=0 T = setTimeout("startTimer()", a); }; } function SlowTemp(){ a=a-50 } function UpTemp(){ a=a+50 } document.getElementById('tempo').innerHTML= b; </script> </head> <body> <a id="myText" href="#">Beat</a> <a id="tempo" href="#">Tempo</a> <audio id="asharpdot" autoplay="autoplay" src="../Rhythm/VM618 home/asharpdot.wav" </audio> <input type="button" onclick="startTimer()" value="Start Timer"> <input type="button" onclick="SlowTemp()" value="Tempo Up"> <input type="button" onclick="UpTemp()" value="Tempo Down"> <audio id="csharp1dot" autoplay="autoplay" src="csharp1dot.wav" </audio> </body> </html> Hi, I am a noobie, now in the middle of learning HTML. I tried to move an image from my local drive but it seem not working. Below are my code. HTML Code: <html> <body style="background-color:PowderBlue;"> <h1>This is Page1</h1> <p>This is some text.</p> <p><a href="mainpage.htm">This is a link to Main Page</a></p> <p style="font-family:times;color:white;font-size:30"><a href="page2.htm" target="_blank"><acronym title = "TEST TEST TEST TEST">This is a link to Page <sup>2</acronym></a></p> <br /> <p> <b>You can also use an image as a link:</b> <a href="mainpage.htm"> <img border="0" src="pulpit.jpg" width="265" height="238"> </a> </p> <br /> <br /> <img border="0" src="http://www.w3schools.com/images/pulpit.jpg" alt = "picture" width="265" height="238"> <h1>Look! Styles and colors</h1> <a href="#tips">Useful Tips Section</a> <p style="font-family:verdana;color:red"> This text is in Verdana and red</p> <p style="font-family:times;color:white;font-size:50px"> This text is in Times and green</p> <p style="font-size:30px">This text is 30 pixels high</p> </body> </html> The image file was located in the path "C:\language\lesson1\images\pulpit.jpg" The script file was located in the path "C:\language\lesson1\test.htm" Is there any initial setup to be done in order the IE could locate the images? Thanks in advance. i am dynamically creating a HTML in which i have an <img> tag but when i click on it it is not giving any sound like we normally get. so what could be wrong. any help on this ASAP is very help full i am dynamically creating a HTML in which i have an <img> tag but when i click on it it is not giving any sound like we normally get. so what could be wrong. any help on this ASAP is very help full Hi! I've been trying none end to get this form working for a friend..I always get the same error - Here's the code, it points to a script with www.godaddy.com (can anyone please look into it?) Thx!! <form name="contact" method="post" action="gdform.asp" enctype="multipart/form-data" id="form"> <input type=hidden name="recipient" value="exquisitetaramtl@live.ca"/> <input type=hidden name="subject" value="Online Inquiry"/> <input type=hidden name="redirect" value="http://www.exquisitetara.com/index3.html"/> <table style="width:515px; height: 149px;" class="style19"> <tr> <td style="width:210px"> <table style="height: 155px"> <tr> <td style="">Name: <br /> <input name="name" type="text" /></td> </tr> <tr> <td style="">E-mail: <br /> <input name="email" type="text" /></td> </tr> <tr> <td style="">Phone: <br /> <input name="phone" type="text" /></td> </tr> </table> </td> <td style="">Message: <br /> <textarea name="message" style="width: 336px; height: 107px"></textarea> <div style="text-align:right"> <span><a href="#" onClick="document.getElementById('form').reset()">clear</a></span><img src="images/spacer.gif" alt="" width="26" height="1"/><span><a href="#" onClick="document.getElementById('form').submit()">send</a></span></div> </td> </tr> </table> </form> Hi All, I am having issues with the following code from a video file (in html). Hoping you can help, I need to make the video start automatically. This video is from Tube Chop (Tube Chop is a similar service than you tube) and you can copy and paste the code from any video and paste is onto a website as an embedded file. I am trying to get the file to start automatically as soon as any user goes to the page (as opposed to having to click on the video). I know for you tube all you have to do is add "&autostart=1 and it works fine. But I tried to put this code below and it still doesn't work. Can someone assist? FYI - Pls note that the part that reads "&start=0&end=26" below was included on purpose so the video starts at the beginning and end after 26 seconds. The website added the code. I need to keep this rule while still getting the video to autostart. Code: <p> <object width="500" height="344"><param name="movie" value="http://swf.tubechop.com/tubechop.swf?vurl=SJyCGltS95k&start=0&end=26&cid=227694"></param><embed src="http://swf.tubechop.com/tubechop.swf?vurl=SJyCGltS95k&start=0&end=26&cid=227694" type="application/x-shockwave-flash" allowfullscreen="true" width="500" height="344"></embed></object></p> Thanks very much. HOW MANY <body> </body> BODIES CAN I HAVE IN THIS INDEX FILE? IF YOU SEE ANY IMPORTANT MISTAKE PLEEAAAASEEE HEEELLLPPPP!!! Code: <html>
<head>PLEASE HELP!</head>
<script type="text/javascript">
window.onload=function()
{
document.getElementById('NewsletterList').onchange=function()
{
window.location=('http://www.homeless-forum.org/'+this.value+'');
}
}
</script>
<body>
<br>
<CENTER>
<select id="NewsletterList">
<a target=\"_blank\" href=\"file.doc\" title=\"\">John Doe<br> XXXXXXXXXXX</br></a>.
<option value=""><b> PLEASE SELECT<b/></option><!--this option takes you to -->
<body mar="0" marginheight="0" bgcolor="rgb(38,38,38)">
"BACKGROUND BLUE GREEN MARMOL "
<embed width="100%" height="100%" name="plugin"
src="http://canImakeApdfFileA1stWebPage?.pdf"
type="application/pdf">
<option value=index.htm>Option #1</option><!--this option takes you to -->
<option value="option2">Option #2</option><!--this option takes you to -->
<option value="option3">Option #3 </option><!--this option takes you to -->
<option value="option4"><br>Option #4</br></option><!--this option takes you to -->
<option value="option5">Option #5</option><!--this option takes you to -->
<option value="option6">Option #6</option><!--this option takes you to -->
<option value="blog/wp-login.php"><!--this option takes you to blog-->
</select>
</body>
</CENTER>
</br>
<html xmlns:v="urn:schemas-microsoft-com:vml"
...............
</html>
I have a webpage with a header, column on each side, footer and a mainContainer in the middle. I would like to set up links on the left column that, when clicked, open a new 'page' in the center (mainContainer). I am using all div tags, no tables. Could someone point me in the right direction? TIA I Can't center my whole nav bar in the middle of the sidebar 1 div. Here is the link for the website. http://northwindappaloosas.com/NewHome.html Hey im new at this html programming and im ok at it but i still need to learn more i need help centering the stuff on my page you will see what i mean if you go to my website. firefoxskins.awardspace.com. I would really like help thank you for your time. Quick question. When using a generator to make a website, it seems that usually everything is placed into "DIV - ABSOLUTE" codes. How do I center everything up so it isn't all stuck to one side for users who have a higher resolution? <tr> <td class="contentarea_b"></td> </tr> <h3>=WFC= WAR FORCE CLAN AMERICAS ARMY</h3> <table cellpadding="0" cellspacing="0" border="0"><tr><td><object type="application/x-shockwave-flash" data="http://video.google.com/googleplayer.swf?docId=4279961105245592436&hl=en" height="350" width="425" style="width:400px; height:326px;" id="VideoPlayback"> <param name="movie" value="http://video.google.com/googleplayer.swf?docId=4279961105245592436&hl=en" /> <param name="allownetworking" value="internal" /> <param name="allowScriptAccess" value="ALWAYS" /> <param name="enableJSURL" value="TRUE" /> <param name="enableHREF" value="TRUE" /> <param name="saveEmbedTags" value="true" /> <param name="flashvars" value="" /> </object></td></tr><tr><td> </table> </td> I am learning how to use Div's to replace Tables for layout. Needless to say, there are many properties I need to learn with CSS's. A friend wants a Floating area on the left which I have created, however I would like to have the box be centered in the main text area. Not sure if that can be done with my prototype at http://www.toddcary.com/viewpoint/div_todd_a.html Any help would be appreciated... Todd |
|||||||