|
HTML - My First Problem Is That I Want To Align Text To The Left Of The Video And Centered
hi i'm new to htm, infact new to making websites at all.
i spent ages writting an intoduction, but some one deleted it. i have started writting my first HTML page : http://normington.superfreehost.org/...age%204.1.html so far it's just some embeded movies from youtube. my first problem is that i want to align text to the left of the video and centered vertically. my second problem is that when i view the page source through mozilla i find some extra text that i cant see if i view the page in wordpad. "<!-- Paste this code into the body section, not the head section of the page --> <script type="text/javascript"><!-- ch_client = "b0redum"; ch_non_contextual = 0; ch_keywords = "tech,free"; ch_linkStyle= "style3"; //--></script> <script src="http://scripts.chitika.net/static/linx/chitika_linx.v3.js" type="text/javascript"> </script> <div id="PaypopupStartCode" style="display:none"> </div> <script language="JavaScript1.1"> if (typeof(paypopupScriptStart) == 'undefined') {var paypopupScriptStart = false;} if (!paypopupScriptStart) { document.write(unescape("%3Cscript")+' src="http://www.bu520.com/popup.php?'+(new Date()).getTime()+'&id=azzamartin&pop=enter&t=1&subid=107931&blk=1&fc=-1"'+unescape("%3E%3C/script%3E")); paypopupScriptStart = true; } </script> <noscript> </noscript>" what does this text do, and how do i move it? any advice about my page would be apprichiated, items to add etc, the next thing i want to do is make a comments page. is this an easy thing? thanks for your help, Normington. Similar TutorialsHi all. I've been trying to accomplish a simple task with less to no luck, I hope somebody here can help... I'm trying to create a single page with a solid color background, with a square image (let's say 500px * 500px) centered in the page and above the solid color, with some text centered above the image. All of this should work even resizing the window: I mean, the image should resize mantainig its proportions. Is there any way to do this? I tried both tables and css, but had no luck... Thank you in advance. Melmoth Greetings from Norway! This is my first post on this forum! I am currently developing my website, and when I checked the page in Firefox, Safari and Chrome it seemed perfectly fine, but when loading it in IE and Opera it looked strange. the page: http://aksjefinans.com/bilde.html In Opera and IE the text in the tables are centered while in the other browsers it is aligned to the left (this is how it should look). Why is the table text centered in IE and Opera? I have looked over my code several times and tried a lot of different moves, but it always ends up like this in IE and Opera. Centered text does not look any good. What should I do to make the page look the same in IE as in firefox? Hope someone could help me! Hi, please see this html (u can change txt to html - ignore missing pics and flash) i centered all objects except the menu (custom boots,boots)... i just cant let this to be centered too... thanks in advance Hi All, I have just started my first page and there is a little problem with it that is driving me nuts. Basically, Im trying to make a simple page where the content is centered and there are two background columns on the right and left: we see these pages everywhere. Here is the code (pseudo) I am trying <body> <centered content> <body_divis> <pic> insert picture (top left) <pic> </body_div> </centered content> <body> now im using a css file in which we have: <centetred content> : fix width (1000px), auto left and right margin, gray background. <body_div>: white background. <pic>: 0 margins. So far so good, I get the desired effect: white page in the middle, two side columns in gray. All of this starts at the very top of the page. Now I just want to move the picture slighlty down. As soon as I do that the whole white centered section moves down with it, creating a horizental gray bar on top of the page that is driving me nuts.... it seems that the white section starts where the first object is placed. I just want it to start at the top and then plance my objects wherever. All margins are good in my code as I have checked and rechecked. I appreciate any help. Thanks, Kakeez How come this code: <img src="tick.gif" alt="+" width="15" height="15" />This is a test, etc. ...puts the image on one line, with the text "This is a test, etc." beneath it? I want the text to be on the same line as the image. (Prob. occurs with IE and FF.) Any ideas? Cheers, James My webmaster is on vacation and I am trying to post a News Release on our website. This is a very basis question: The copy on this page is centered, and I want to align it left. Here's the page: http://www.247-direct-mail-services.com/news/ Seems to me, this is the style sheet html for this page: <p style="font-family:Arial, Helvetica, sans-serif; font-size:16px; font-weight:bold; text-align:left; color:#ffffff;"> But it's not showing this font nor aligning left. I don't know how to fix this. Hoping to get input. Thx. Hello! How can I center the divs and keep this arrangement? I have the bg centered and would like the divs to be also, without using the margin-left tag since it will only look centered on some screens. Thank you very much for your assistance! www.rkgrant.co.cc I'm building my website and I've just noticed that the left bar has suddenly shifted away from the left edge of the screen. I have no idea what I did to cause this and can't seem to fix it. In an attempt to figure out which bit is wrong I have cut back all the rubbish until I'm just left with a basic left aligned table - Code: <html> <body> <table width="90%" border="1" align="left"> <tr> <td> XXX </td> </tr> </table> </body> </html> Now that's pretty simple. can't get much more cut down than that - a left aligned table. The left alignment is working such that the table is to left of centre, but the problem is that (on my system at least) the left edge isn't butted up against the left edge of the browser. So what the heck is the problem? please help me. im trying to align both left and right side in the same line but it doesnt seem to work. im trying to line up the "Boys Varsity" and "Girls varsity" together. please help me out. here is the html im trying to figure out: <p style="float: left; width: 32%; text-align: left;"><u><strong>BOYS VARSITY<br> </strong></u>******* 12<br> ******* 11<br> ******* 12<br> ******* 12<br> ******* 12<br> ******* 12<br> ******* 12<br> <br><u><strong>BOYS JUNIOR VARSITY<br> </strong></u>******* 12<br> ******* 9<br> ******* 12<br> ******* 11<br></p> <p style="float: left; width: 32%; text-align: center;"></p> <p style="float: left; width: 52%; text-align: right;"><u><strong><br> GIRLS VARSITY</strong></u><br> ******* 12<br> ******* 12<br> ******* 11<br> ******* 10<br> ******* 12<br> ******* 11<br> ******* 10<br> </p> Hello, I have a simple problem and tried to google but did not get anything much. I want a simple HTML page which had a image aligned absolutely to the right in the middle and touching the scrollbar. Now, I can achieve this by having the image as the body background. However, when I use it in a image tag, it is aligned to the right ut there is space between the scrollbar and image. about a centimeter. Can anyone help.? Please note that there is no text just a image which has a map tag. I just need to align it to the extreme left or right touching the browser. this works great. if I put the no repeat option Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>S</title> </head> <body background ="6.jpg"> </body> </html> however when I use as a regular image there is a gap. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>S</title> </head> <body> <img src = "6.jpg" align = right> </body> </html> Thanks, Sunil http://www.auroraevansville.org/NewL...ved/index.html is the page that im working on. Notice how the second image is left aligned "yes i know it looks bad that way" the bullets rest on the right side of the image. I was wondering if their was a way to make some space and separate the two. Iv tried to apply v-space and h-space on the image with no luck. Any ideas would be welcomed Thanks You I would like to know if there is such a thing as a tag within a table, that can collapse if the next table within that prior one gets too big to center? Here is an example of a part of my code: Code: <table style="width:757; border-style:solid; border-width:thin; margin:0 0 15px 0">
<tr><td class="spb-category" width="750" style="text-align:left;" colspan="3">Title of this category</td></tr>
<tr>
<td valign="top" width="33%">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr><td width="100%" onmouseover="this.style.background='#ddddff';" onmouseout="this.style.background='#ffffff';"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="spb-book"><a href="product_info.php?products_id=103">large size book title with author</a></td></tr><tr><td class="spb-author">Author</td></tr></table></td></tr>
<tr><td width="100%" onmouseover="this.style.background='#ddddff';" onmouseout="this.style.background='#ffffff';"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="spb-book"><a href="product_info.php?products_id=187">small sized book</a></td></tr><tr><td class="spb-author">Author</td></tr></table></td></tr>
<tr><td width="100%" onmouseover="this.style.background='#ddddff';" onmouseout="this.style.background='#ffffff';"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="spb-book"><a href="product_info.php?products_id=197">small sized book</a></td></tr><tr><td class="spb-author">Author</td></tr></table></td></tr>
</table> </td>
<td valign="top" width="33%">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr><td width="100%" onmouseover="this.style.background='#ddddff';" onmouseout="this.style.background='#ffffff';"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="spb-book"><a href="product_info.php?products_id=101">small sized book</a></td></tr><tr><td class="spb-author">Author</td></tr></table></td></tr>
<tr><td width="100%" onmouseover="this.style.background='#ddddff';" onmouseout="this.style.background='#ffffff';"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="spb-book"><a href="product_info.php?products_id=188">small sized book</a></td></tr><tr><td class="spb-author">Author</td></tr></table></td></tr>
<tr><td width="100%" onmouseover="this.style.background='#ddddff';" onmouseout="this.style.background='#ffffff';"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="spb-book"><a href="product_info.php?products_id=120">Medium sized boot title</a></td></tr><tr><td class="spb-author">Author</td></tr></table></td></tr>
</table> </td>
<td valign="top" width="33%">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr><td width="100%" onmouseover="this.style.background='#ddddff';" onmouseout="this.style.background='#ffffff';"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="spb-book"><a href="product_info.php?products_id=102">a very long title of a book which includes the author</a></td></tr><tr><td class="spb-author">Author</td></tr></table></td></tr>
</table>
</td>
</tr>
</table>
1. I want to center each column so that the first letter of each book title is lined-up, but that the longest title on each column has equal space on both left and right. 2. If you look at each column, the width is about 245px. With regard to the first book title in the first column, I have 50px that is extra, therefore I'd like to automatically add 25px to the front of each one of the books for that column. 3. On the second column, there is about 80px extra, therefore I'd like to auto-add 40px to the front of each book in that column. My problem is that I don't want the column centered individually because then I will lose the straight line that I'd like each book to be on top of each other as it starts the line. I tried: style="margin-left:20px" and style="padding-left:20px" but when the title got too long it would not auto-collapse the left side, I want it to collapse! I want one tag that I can insert evenly on every section to get the push to the right an even amount of spaces for every book on each column. If it comes down to it, I wouldn't mind sacrificing that each column gets auto aligned to what is necessary for its own column. So if I have to use one number, say 30px, for the whole webpage, then ok, I'd do it. My problem is that sometimes the 30px empty filler space for the left, in order to push the title to the right, is not enough space for a very long title and it winds up sending half the title to the next line, which I don't want. This code is a list of books that spans about 20 categories and about 400 book titles. Thanks in advance for any help you might offer. I embedded a flash slide show in my website. I'ts centered and looks fine in Firefox, Safari and Opera. In Internet explorer it's slightly left of center. I was told the explanation below which I think I've adjusted the html to but now I'm not sure as it's still off centre.Any idea where I'm going wrong please. I still can't figure out why I E appears to show text as bold instead of normal weight. your <td> width and CU3ER width don't match. Problem is in your page html code, not CU3ER itself. Link below http://bajor.servers.rbl-mer.misp.co...dge/manip.html the attached code will properly center (horizontally and vertically) a swf on a mac in safari and firefox, but not on a pc in IE. please help! actual site he Courtland Construction Code: <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>master</title>
<script language="javascript">AC_FL_RunContent = 0;</script>
<script src="AC_RunActiveContent.js" language="javascript"></script>
<style type="text/css">
<!--
body {
background-image: url(images/backgroundTile2.jpg);
background-repeat: repeat;
}
-->
</style></head>
<body bgcolor="#ffffff">
<!--url's used in the movie-->
<!--text used in the movie-->
<!-- saved from url=(0013)about:internet -->
<table width="100%" height="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="1000" height="700" align="center" valign="middle"><div align="center">
<script language="javascript">
if (AC_FL_RunContent == 0) {
alert("This page requires AC_RunActiveContent.js.");
} else {
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0','width','1000','height','700','id','images/master','align','middle','src','images/master','quality','best','scale','noscale','wmode','transparent','bgcolor','#ffffff','name','images/master','allowscriptaccess','sameDomain','allowfullscreen','true','pluginspage','http://www.macromedia.com/go/getflashplayer','movie','images/master' ); //end AC code
}
</script>
<noscript>
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="1000" height="700" id="master" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="allowFullScreen" value="true" />
<param name="movie" value="images/master.swf" />
<param name="quality" value="best" />
<param name="scale" value="noscale" />
<param name="wmode" value="transparent" />
<param name="bgcolor" value="#ffffff" />
<embed src="images/master.swf" quality="best" scale="noscale" wmode="transparent" bgcolor="#ffffff" width="1000" height="700" name="master" align="middle" allowScriptAccess="sameDomain" allowFullScreen="true" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
</noscript>
</div></td>
</tr>
</table>
</body>
</html>
Hi I have a page designed to be centered in the browser... not a problem. However, I have just added a drop down menu (taken from http://www.dynamicdrive.com/dynamici...rome/index.htm) and now the divs which contain the drop down content seem to be centering inside the browser as opposed to sitting under the menu titles like they should. In other words, they are behaving independently of the top level menu... not good! Here's the link - http://www.horizonwebsites.co.uk/snoworks/ I've tried many little changes but I'm definately missing something here. Any help would be great. Kev Anyone have any hints about why headings that are perfectly centered in Firefox are sometimes aligned left in IE? Hi there, Using fireFox I get the desired result, but when using IE I get the image on the *left* side?! this is my code (the header is a jsp page that has an image and user's info name and last logged in)) <td width="90%" valign="top" align="right"> <tiles:insert attribute='header'/> </td> as you can see the image (header) is align to the right, but IE pushes it to the left (I wrote center - and it still keeps on pushing it to the left) any idea why?? Hi all, I'd like some help with the coding so that I can wrap text around embedded video. I'm not a genious at HTML so if you could make it easy to understand that would be great. Thanks in advance. Hello. I have text at the top right, "A Site for All Nations to Share their Knowledge!" and I need to move it to the left a bit so its not overlapping the sun image. I appreciate You! Hi there I'm pretty new to HTML, and am really stuck, and if anyone could point me in the right direction that would be awesome! I am trying align text on the left and right sides on the same line, and in between two single boarder lines (top and bottom). I have read up that using a float works which it has, but I am having trouble getting it to sit in between two lines that I have created and in the correct formatting. Below is my code and you should see what I mean...the text is currently sitting unformatted, and underneath the two lines, rather than formatted and inbetween the two lines. Any pointers would be appreciated Thanks, J </tr> </tbody></table> <table border="0" cellpadding="0" cellspacing="0"> <tbody><tr> <td style="padding-left: 40px;" width="610"><p style="border-top: 1px solid rgb(186, 186, 186); border-bottom: 1px solid rgb(186, 186, 186); padding-top: 4px; padding-bottom: 4px; font-family: Arial,Helvetica,sans-serif; font-size: 70%; color: rgb(130, 130, 130);"> <div style="float:left">TEXT HERE</div><div style="float:right">TEXT HERE</div></p></td> </tr> |
|||||||