|
HTML - Aligning Text Correctly
Hello everyone,
I've recently started a website at Angel Fire and went with HTML coding all the way. The problem I have is getting my text in their correct positions! It's been frustrating so, and I've searched everywhere for proper coding. Everytime I try to center certain text in the middle of the webpage, it pushes left aligned text further down. Any advice, coding, that would keep the text in check? Thanks. Similar TutorialsHi guys, I'm very new here - literally just searched the web for help on this problem which has been plaguing me for some time... I'll post the code below, but basically, the div_id centre_image, the body text and the right hand side graphics are correctly formatted just in the wrong place! I need them to be to the right hand side of the Left hand menu... I'm hoping I make sense!? There is CSS as well but not sure whether or not this is a CSS issue or html! I would be really greatful if someone could help me out. I'm fairly new to website design but am trying my best using various tutorials on the web and compile something half decent! Thanks in advance, Graham. Code: <!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Double Glazing | Windows | Doors | Conservatories | Rooftrim</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="header">
<div id="email_header"><a href=" mailto: xxxx@zurichtitanium.com">xxxx@zurichtitanium.com</a></div>
</div>
<div id="blue_banner">
<h1>Double Glazing Worcester</h1>
</div>
<div class="cleaner"></div>
<div id="menu_wrap">
<div id="tabs">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Windows</a></li>
<li><a href="#">Doors</a></li>
<li><a href="#">Conservatories</a></li>
<li><a href="#">Rooftrim</a></li>
<li><a href="#">Get a Quote</a></li>
</ul>
</div>
</div>
<div id="holder">
<div id="lhs_menu_wrap">
<div id="windows_menu">
<ul>
<li><a href="#">Sleek White</a></li>
<li><a href="#">Woodgrain Collection</a></li>
<li><a href="#">Specialist Finishes</a></li>
<li><a href="#">Security</a></li>
<li><a href="#">Energy Saving</a></li>
<li><a href="#">Maintenance Free</a></li>
<li><a href="#">The Logical Choice</a></li>
</ul>
</div></div>
<div id="centre_image">
<div id="centre_LHS_pic"></div>
<div id="centre_RHS_pic"></div>
<div id="getquote_button"><a href="#">Get a Free Quote...</a></div>
</div>
<div id="RHS_Content">
<div id="rhs_window_offer">Double Glazed Windows...<div id="win_text1"><a href="#">Get Quote</a></div></div>
<div id="rhs_cons_offer">Your New Conservatory...<div id="win_text2"><a href="#">Get Quote</a></div></div>
<div id="rhs_trim_offer">Transform Your Roofline...<div id="win_text3"><a href="#">Get Quote</a></div></div>
<div class="guarantee_logo"></div>
</div>
<div id="body_text">
If you are considering enhancing your home, you owe it to yourself to get a professional consultation. At Zurich Titanium we pride ourselves on giving you exactly what you want. Whether it be treating yourself and your home to new <h2>double glazing windows</h2>, <h2>doors</h2>
or a <h2>conservatory</h2>, invite us to show you what we can do. We guarantee you won't be disappointed.
<p>We offer a fully customisable suite of Home Improvement Products, tailor made for your home, to ensure you get what you want and need, and not wasting money on features you'll never use. With our own highly skilled installers, we are able to keep quality control in house, enabling us to give, as standard, the unrivalled <b>Zurich Titanium 10 Year Guarantee</b> on all work undertaken.</p> <p>Our bespoke quotation service, available totally free of charge, will allow you to design the windows or doors, conservatory or roofline, most suited to your home, give you an accurate assessment of the work involved, and of course an exact price.</p>
<div id="body_footer"></div>
</div>
</div>
<div id="footer">Zurich Titanium Home Enhancements Ltd, Registered in England and Wales xxxxxxxx. xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx.</div>
</body>
</html>
And CSS to follow... It may be somewhat rough around the edges; different hints and tips put together from across the web! Thanks so far Michael... Hi, Im trying to make my footer content align correctly to the main content when a window resizes. The apdivs don't seem to want to move at all even with a relative position etc. I have tried everything but just cant get it to work can someone help please? http://pjm.co.uk.uksite4.yourwebserv...splay&PageID=5 Also some one commented before on the amount of css and JS pages. These will al be stripped out as its an Open sources system im using! Thansk alot Joe Hi I am new to this site and very new to html. I just know the basics. My problem is, is there a way to make 1 line of text be split for example have 1 part of the line be aligned to the left and the other to the right. Here is an example, the first part is what is actually happening and the second part is the way i want it to look. This is an example.This is an example This is an example. This is an example. I just realized that my second part of the example didnt come out the way i wanted. So i want the second part to have the first part aligned to the left and the second part aligned to the right. Please help. Its probably really easy but like i said i just know the basics. Thanks in advance for any help that is given Mike I didn't screw this page up like the earlier page I posted.I inserted text ,but am unable to align it properly.Any help would make me and Kelli Maroney very happy this New Year. Hi, I want to align some text but not with the center or something but i want it to aling to a square on my background image and i also want to make it so that is looks the same on widescreens. at the moment i do it like this <BODY leftmargin="150%" topmargin="220%"> f </BODY> But when i enter window mode the text also moves. can someone help me with tihs ? Hi, I seem to have lost the code I had for aligning text. I know it's simple, can someone help me. Take a look at my newsletter at http://www.ilovejesus.com/lot/awesomebks/news.shtml. You will note the text is not lined up correctly with the book covers. I don't want it to be completely lined up like a newspaper, just look a little better than it does. Thanks. Hey guys, I am not sure how to explain this correctly so I hope just seeing it and the page source can help explain it. On this page.. http://www.outdoorescapade.com/hiking.html About 3 quarters of the way down, if you click on the slide panel 'button' under lake louise and smith dorrien, it slides down but the text of 'slide panel' changes to being squished on the right hand side and the list on the left doesn't end where it is suppose to. It is pushed a bit down which I think is what is causing the text in the button to be messed up a little. I've checked it many times and even copied it from the other parts where I have used it on the page but it still does the same thing... Any ideas? Any help would be greatly appreciated. Thanks! I have a cell text linked to a css stylesheet. the style for that "text" is as follows: .text { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #333333; text-align:left } How do I align the text to the top of the cell rather than middle? http://www.miamiknight.com/table.htm How do I get the text in all 3 columns to align at the top? I had to add breaks or rows in column 3 at the bottom to bring the text higher and then column 2 had the text drop lower. Is there an easy way to always have text align at the tops of each column? Hi, Does this look right i cant to have a header image and align come copy over it: <body> <!-- NEWS 1 --> <h1><img src="box.jpg" width="300" height="50" /></h1> <h2>News Item 1</h2> <!-- NEWS 2 --> <h1><img src="box.jpg" width="300" height="50" /></h1> <h2>News Item 2</h2> </body> h2 { position: relative; top: -37px; left: 135px; text-align: right; width: 150px; } I'm new ,but had some success editing a website.I'm having trouble aligning the new text with the rest of the page. http://www.kellimaroney.com/press.html <ul> <li><strong>2010</strong><br> <blockquote> <p xmlns="http://www.w3.org/1999/xhtml" id="sites-page-title-header"><a href="http://www.youtube.com/user/RockandRollIncTV">New Web Series:Rock & Roll,Inc</a></p> <p xmlns="http://www.w3.org/1999/xhtml"> </p><p xmlns="http://www.w3.org/1999/xhtml"><strong><a <ul> <blockquote> <p xmlns="http://www.w3.org/1999/xhtml" id="sites-page-title-header"><a href="http://www.examiner.com/horror-in-national/exclusive-interview-with-actress-kelli-maroney-1 ">Horror Examiner Interview</a></p> <p xmlns="http://www.w3.org/1999/xhtml"> </p> <p xmlns="http://www.w3.org/1999/xhtml"><strong><a Hello, This is my first time in HTML world and I'm a complete n00b. I'm trying to put a counter on my blog for facebook/twitter/google+/rss to keep track of them on the blog. This is working fine, at least facebook and twitter are automatically updated (through a script I picked up on the internet), google+ and RSS is still manual, I still need to figure those ones out. Now I would like to nicely align the counters with the icons I have, and that's my problem. I want the text centered under the icon it belongs to, but I don't know how. With my lack of knowledge I found a somewhat cumbersome way to do that. Not that bad, simply not nice coding, but when the page is zoomed in or something the like, the aligning obviously doesn't work anymore. Could someone help me do the aligning properly? The code of the widget I have pasted below and the relevant blog: http://gebarentaal-signlanguage.blogspot.com. HTML Code: <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
var f_page = "149198761796791"; // the page name for your fan page, e.g. the 'wvumountaineers' part of <a href=\"http://facebook.com/wvumountaineers\" target=\"_blank\" rel=\"nofollow\">http://facebook.com/wvumountaineers</a>
var t_page = "Gebarentaal_"; // the account name for your main twitter account
function add_commas(number) {
if (number.length > 3) {
var mod = number.length % 3;
var output = (mod > 0 ? (number.substring(0,mod)) : '');
for (i=0 ; i < Math.floor(number.length / 3); i++) {
if ((mod == 0) && (i == 0)) {
output += number.substring(mod+ 3 * i, mod + 3 * i + 3);
} else {
output+= ',' + number.substring(mod + 3 * i, mod + 3 * i + 3);
}
}
return (output);
} else {
return number;
}
}
// when document is ready load the counts
$(document).ready(function(){
// grab from facebook
$.getJSON('https://graph.facebook.com/'+f_page+'?callback=?', function(data) {
var fb_count = data['likes'].toString();
fb_count = add_commas(fb_count);
$('#fb_count').html(fb_count);
}); // grab from twitter
$.getJSON('http://api.twitter.com/1/users/show.json?screen_name='+t_page+'&callback=?', function(data) {
twit_count = data['followers_count'].toString();
twit_count = add_commas(twit_count);
$('#twitter_count').html(twit_count);
});
});
</script>
<a href="http://www.facebook.com/pages/Gebarentaal/149198761796791" imageanchor="1" style="margin-left: 0em; margin-right: 0em;"><img border="0" src="http://1.bp.blogspot.com/-sT9lHle5N54/TqgOWhi-amI/AAAAAAAAFCU/MwoQL3ZhEy4/s1600/facebook-30x43.png" />
</a>
<a href="http://twitter.com/Gebarentaal_" imageanchor="1" style="margin-left: 1.5em; margin-right: 0em;"><img border="0" src="http://2.bp.blogspot.com/-eVZSNf1mj_E/TqgOX_ldq1I/AAAAAAAAFCk/2wDDaA8esG8/s1600/twitter-30x43.png" /></a>
<a href="https://plus.google.com/b/118073168609419238977/" imageanchor="1" style="margin-left: 1.5em; margin-right: 0em;"><img border="0" src="http://3.bp.blogspot.com/-icT9kVFhtOs/TqgOXLJCbBI/AAAAAAAAFCY/pU4wo8HyHNI/s1600/googleplus-30x43.png" /></a>
<a href="http://gebarentaal-signlanguage.blogspot.com/feeds/posts/default" imageanchor="1" style="margin-left: 1.5em; margin-right: 0em;"><img border="0" src="http://3.bp.blogspot.com/-ShqPVqX-vhs/TqgOXX5m9WI/AAAAAAAAFCg/WFRLxQ4yjuM/s1600/rss-30x43.png" /></a><br />
<p>
<font size="4" face="arial" color="#3c5f9d" style="margin-right:0.9em">
<span id="fb_count"></span>
</font>
<font size="4" face="arial" color="#63dfe5" style="margin-right:1.6em">
<span id="twitter_count"></span>
</font>
<font size="4" face="arial" color="#505050" style="margin-right:2em">
8
</font>
<font size="4" face="arial" color="#c35b02" >
3
</font>
<br />
<font size="2" face="arial" color="#3c5f9d" style="margin-right:0.8em">
likes
</font>
<font size="2" face="arial" color="#63dfe5" style="margin-right:0.5em">
followers
</font>
<font size="2" face="arial" color="#505050" style="margin-right:1em">
+1's
</font>
<font size="2" face="arial" color="#c35b02">
readers
</font>
</p>
Well, i've been stressing myself over this quite a while. I know there is a way to it but it's been a long time since I used HTML. And I was not even good with HTML back then so it's worser. I`m trying to align a javascript web analyzer element with a piece of text. The thing is that even if i`m using things such as <div style="vertical-align:middle">code</div>, it won't have any effect. So here's the code: Code: <script type="text/javascript" language="javascript">
var site_id = 48608;
var gtopSiteIcon = 81;
var _gtUrl = (("https:" == document.location.protocol) ? "https://secure." : "http://fx.");
document.write(unescape("%3Cscript src='" + _gtUrl + "gtop.ro/js/gTOP.js' type='text/javascript'%3E%3C/script%3E"));
</script> "Piece of text"
The text will just stay at the baseline of the image no matter what. Any help is appreciated ! EDIT: It works with normal images, but not with javascript. Hi, I've been trying to set up a page where I have my e-mail address on one side of the page and my phone number on the same line but on the other side of the page. The e-mail address aligns left automatically, and when I use <p align=right>, it moves the phone number down onto the next line. <align=right> on its own does nothing. Does anyone know the code to align right without bumping the text down to the next line? Thank you so much for any help you can provide. Michael I am designing a header for my website and need to put text on both the left and right hand side of the topline for the website. When I try to put the code it overspills to next line so when I save it all the information I need on the same line goes over to the next line. How can I put the code in a different line in my coding but display it on the same line on a browser? Hi, I am writing various things on one line - such as Previous, Back to Main Menu and Next - but would like to align the differently e.g. I would like "previous" to be aligned to the left of the page, "back to Main Menu" in the middle and "Next" on the right side. I have tried pressing space bar - but am only able to do one space in Dreamweaver. Any ideas? Thanks. I am having problem aligning text next to a javascript slideshow in a table. I can't get text to sit next to the show. It always goes on the top or bottom. Please, any help? <div id="myBox"> <p>4 Wheel Madness</p> <img src='sampleimage.png' width="65" height ="65" alt="img"> </div> What would i add to this to make the image go to the LEFT of the box, and then the text to go to the RIGHT of the box? ##### Text here, ##### Text here, ##### Text here, ^ Just like that Thank you for any comments Here is my code: <!-- DT Centrepiece - files/permissionchecker.asp Version 1.0 --> <!-- DT Centrepiece - Connections/CP3.asp Version 1.0 --> <!-- DT Centrepiece - files/site.asp Version 1.0 --> <!-- DT Centrepiece - files/pagepermissions.asp Version 1.0 --> <!-- DT Centrepiece - files/settings.asp Version 1.0 --> <!-- DT Centrepiece - files/customcode.asp Version 1.0 --> <!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"> <head> <!-- DT Centrepiece - index.asp Version 1.0 --> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <link rel="shortcut icon" href="favicon.ico" /> <title>DT Centrepiece 3 - Home Page</title> <link rel="stylesheet" href="design/style.css" type="text/css" /> <!-- DT Centrepiece - files/menuconstructor.asp Version 1.0 --> <script type="text/javascript"> <!-- var time = 3000; var numofitems = 2; //menu constructor function menu(allitems,thisitem,startstate){ callname= "gl"+thisitem; divname="subglobal"+thisitem; this.numberofmenuitems = allitems; this.caller = document.getElementById(callname); this.thediv = document.getElementById(divname); this.thediv.style.visibility = startstate; } //menu methods function ehandler(event,theobj){ for (var i=1; i<= theobj.numberofmenuitems; i++){ var shutdiv =eval( "menuitem"+i+".thediv"); shutdiv.style.visibility="hidden"; } theobj.thediv.style.visibility="visible"; } function closesubnav(event){ if ((event.clientY <48)||(event.clientY > 107)){ for (var i=1; i<= numofitems; i++){ var shutdiv =eval('menuitem'+i+'.thediv'); shutdiv.style.visibility='hidden'; } } } // --> </script> </head> <body onclick="closesubnav(event);"> <a name="top"></a> <div class="skipLinks">skip to: <a href="#content">page content</a> | <a href="#pageNav">links on this page</a> | <a href="#globalNav">site navigation</a> | <a href="#siteInfo">footer (site information)</a> </div> <div id="masthead"> <!-- DT Centrepiece - files/sitetitle.asp Version 1.0 --> <h1 id="siteName">DT Centrepiece 3</h1><!-- DT Centrepiece - files/utility.asp Version 1.0 --> <div id="utility"> <a style="text-decoration:none">Welcome, Administrator</a> | <a href="manage.asp">Manage</a> | <a href="myaccount.asp">My Account</a> | <a href="logout.asp?continue=/cp3/index.asp">Log out</a> </div><!-- DT Centrepiece - files/global.asp Version 1.0 --> <div id="globalNav"> <img alt="" src="design/gblnav_left.gif" height="32" width="4" id="gnl" /> <img alt="" src="design/glbnav_right.gif" height="32" width="4" id="gnr" /> <div id="globalLink"> <a href='category.asp?page=Home+Page' id='gl1' class='glink' onmouseover='ehandler(event,menuitem1);'>Home Page</a><a href='category.asp?page=Home+Page+2' id='gl2' class='glink' onmouseover='ehandler(event,menuitem2);'>Home Page 2</a> </div> <!--end globalLinks--> <form id="search" action="index.asp"> <input name="searchFor" type="text" size="10" /> <a href="index.asp">search</a> </form> </div> <div id='subglobal1' class='subglobalNav'> <a href='index.asp?page=Home+Page'>Home Page</a> </div><div id='subglobal2' class='subglobalNav'> <a href='index.asp?page=DT+Browser'>DT Browser</a> | <a href='index.asp?page=Home+Page+2'>Home Page 2</a> </div> <!-- end globalNav --> </div> </div> <!-- end masthead --> <div id="pagecell1"> <!--pagecell1--> <img alt="" src="design/tl_curve_white.gif" height="6" width="6" id="tl" /> <img alt="" src="design/tr_curve_white.gif" height="6" width="6" id="tr" /> <!-- DT Centrepiece - files/breadcrumb.asp Version 1.0 --> <div id="breadCrumb"> <a href='index.asp?page=Home+Page'>Home Page</a> / </div> <div id="pageName"> <h2>Home Page</h2> <img alt="small logo" src="images/icon.png" height="48" width="48"/> </div> <div id="pageNav"> <!-- DT Centrepiece - files/sectionlinks.asp Version 1.0 --> <div id="sectionLinks"> <a href='#InternetNZ+treads+softly+on+bank+code'>InternetNZ treads softly on bank code</a> <a href='#Story'>Story</a> <a href='#Capsule'>Capsule</a> <a href='#Capsule2'>Capsule2</a> </div><!-- DT Centrepiece - files/relatedpages.asp Version 1.0 --> <div class="relatedPages"> <p><strong>Related Pages:</strong></p> <a href='index.asp?page=Home+Page+2'>Home Page 2</a> </div><!-- DT Centrepiece - files/customad.asp Version 1.0 --> <div id="relatedPages" class="relatedPages"> <!--Insert your custom website ad here. This ad will show under the related links. If you don't want to put an ad on your site, then simply delete the contents of this file. If you need this file back at any time, you can download it from our website. --> </div> </div> <div id="content"> <!-- DT Centrepiece - files/feature.asp Version 1.0 --> <div class='feature'><a name='InternetNZ+treads+softly+on+bank+code'></a><p><a href='deletecontent.asp?id=16&page='><img src='icons/delete_16.png' alt='' border='0' alt='Delete Content' /></a><a href='editcontent.asp?id=16&page='><img src='icons/documents_16.png' alt='' border='0' alt='Edit Content' /></a></p><a href='http://www.stuff.co.nz/4153156a28.html' target='_blank'><img src='http://www.fnbholdrege.com/media/Online1.jpg' alt='' width='280' height='200' border='0' /><h3>InternetNZ treads softly on bank code</a></h3><p><p> In a move that is likely to disappoint consumer advocates, InternetNZ has proposed only minor changes to a controversial banking code of practice that came into effect a month ago that could leave consumers footing the bill for Internet fraud. <br /><br /> The changes proposed by the non-profit society would mean that consumers could still be held liable for losses for Internet fraud, up to the value of any money in their account or their overdraft limit, if they accessed Internet banking using a computer that was not up-to-date with "any recent major security upgrades or releases".</p> <h6>[Via <a href="http://www.stuff.co.nz/" target="_blank">Stuff.co.nz</a>].</h6></p></div><!-- DT Centrepiece - files/story.asp Version 1.0 --> <div class='story'><a name='Story'></a><p><a href='deletecontent.asp?id=2'><img src='icons/delete_16.png' alt='' border='0' alt='Delete Content' /></a><a href='editcontent.asp?id=2'><img src='icons/documents_16.png' alt='' border='0' alt='Edit Content' /></a></p><a href='http://www4.webng.com/dtapplications/' target='_blank'><h3>Story</h3></a></h3><p>This is the new DT Centrepiece 3. This is a story.</p></div><!-- DT Centrepiece - files/capsule.asp Version 1.0 --> <div class='story'><table width='80%' cellpadding='0' cellspacing='0' summary='' align='center'><tr valign='top'><td class='storyLeft'><a name='Capsule'></a><p><a href='deletecontent.asp?id=4'><img src='icons/delete_16.png' alt='' border='0' alt='Delete Content' /></a><a href='editcontent.asp?id=4'><img src='icons/documents_16.png' alt='' border='0' alt='Edit Content' /></a></p><p><a href='http://www4.webng.com/dtapplications/' target='_blank'>Capsule</a></p><p>This is the new DT Centrepiece 3. This is a capsule.</p></td><td><a name='Capsule2'></a><p><a href='deletecontent.asp?id=5'><img src='icons/delete_16.png' alt='' border='0' alt='Delete Content' /></a><a href='editcontent.asp?id=5'><img src='icons/documents_16.png' alt='' border='0' alt='Edit Content' /></a></p><p><a href='#'>Capsule2</a></p><p>This is the new DT Centrepiece 3. This is a capsule.</p></td></tr></tr></table></div> <p style="font-size: x-small" align="right"><a href="#top">Top</a></p> </div> <!--end content --> <!-- DT Centrepiece - files/siteinfo.asp Version 1.0 --> <div id="siteInfo"> <img src="images/icon.png" width="20" height="20" /> <a href='siteinfo.asp?page=About+Us'>About Us</a> | <a href='siteinfo.asp?page=Site+Map'>Site Map</a> | <a href='siteinfo.asp?page=Privacy+Policy'>Privacy Policy</a> | <a href='siteinfo.asp?page=Contact+Us'>Contact Us</a> | ©2007 DT Services </div> </div> <!--end pagecell1--> <br /> <!-- DT Centrepiece - files/admin_page.asp Version 1.0 --> <div id="admin"> <a href="addcategory.asp"><img src="icons/add_16.png" border="0" alt="Add Category"></a> <p> </p> <a href="addpage.asp?page=Home+Page"><img src="icons/add_16.png" border="0" alt="Add Page"></a> <br /> <a href="deletepage.asp?page=Home+Page"><img src="icons/delete_16.png" border="0" alt="Delete Page"></a> <br /> <a href="editpage.asp?page=Home+Page"><img src="icons/documents_16.png" border="0" alt="Edit Page"></a> <br /><br /><br /> <a href="addcontent.asp?page=Home+Page"><img src="icons/add_16.png" border="0" alt="Add Content"></a> <br /> <a href="deleteallcontent.asp?page=Home+Page"><img src="icons/delete_16.png" border="0" alt="Delete All Content"></a> <br /> </div> <!-- DT Centrepiece - files/menuend.asp Version 1.0 --> <script type="text/javascript"> <!-- var menuitem1 = new menu(2,1,"hidden");var menuitem2 = new menu(2,2,"hidden"); // --> </script> </body> </html> For some odd reason, it shows this in Firefox and this in Internet Explorer... Any help? Cheers Hey there, I have some text in a table that i want to vertically align center, however nothing i try with html or css seems to work. This is my current code atm; Code: <table cellpadding="0">
<tr>
<td width="150" height="100" style="vertical-align:middle">
<img src='portals/default.jpg' > </td><td style="vertical-align:middle">
<h3><b><a href="/games/node/2">Welcome to the Halo Portal</a></b></h3><i><div style='font-size:0.9em; line-height: 0.3em;'>Posted by NightFox, on 15/03/09</div></i><br /><div style='line-height: 0.2em'><p>Welcome to the Halo Portal</p>
</div>Halo <td></tr>
</table>
I want it all to vertically aligned centrally so that the text will line up with the center of the thumbnail - attached is wat it looks like atm. If anyone has any ideas please let me know (html, css, or php i don't mind) Regards NightFox |
|||||||