|
HTML - Dividing Links Into 3 Rows
Hello,
Can someone help me with this here. I want to make 3 tables with links to other sites on there. I want them to count down from 1 - 5 then 6 - 10 and 11 - 15. In the picture I want to have one big bar running across saying BEST LINKS and under it the website links. What I need is the code to divide/split the links. Code: <tr> <td width='100%' colspan='4' style='border: 1px solid #CCCCCC'> <table cellpadding='0' cellspacing='4' width='100%'><tr> <td width='25%' valign='top'> <?php include "topratedmenu.php"; ?> </td> <td width='25%' valign='top'> <?php include "mostpopularmenu.php"; ?> </td> <td width='25%' valign='top'> <?php include "topplayersmenu.php"; ?> </td> </tr></table> </td> </tr> <tr> <td width='25%' colspan='1'> </td> <td width='25%' colspan='1'> </td> <td width='25%' colspan='1'> </td> <td width='25%' colspan='1'> </td> </tr> Similar TutorialsOkay. I am trying to make a website where it has the text in the middle of the screen but is limited by borders (look likes this). I am not sure if this is done by CSS or by HTML. Please respond with some info that can help/guide me to success. Thanks! Hi, I'm a noob at HTML, and I've learned a lot, but I can't seem to get this right. I want to divide all my HTML documents into 3 sections, without frames. I want the middle to be 800px, and on its left and right 200px(separately). However, I can't seem to get it right, I want to divide it so that the code in each division doesn't affect what's in the middle9vaguely speaking of course). Any help is appreciated. Dear HTMLforums! I'm currently having a question about the best way / proper / easiest way to make a navbar, out of an straight 50px box. This is currently the HTML document; THIS this is currently the .CSS file to the HTML document over; THIS Here is a picture showing where / what i want to make a navbar out of; HERE (The name of the css element is #Navbar) So, what i'm trying to do simply is to split this "line" or box up into pieces (take 5 for an example). what would be the right way to do this to keep it simple? Cheers, guys! - InZeL Hi everyone, I hope I have posted this in the right area. This is my first time posting here. I currently have my main pages listed at the top of my site as graphics (see fussybaby.ca). I would like to potentially remove these graphics and use text links instead - I had the graphics designed for me, so I can't just go in and make new ones, however I'd like to change/rearrange the links and add some new ones. So my question is: How hard is this to do? Is this something I need to hire someone to do for me? Thanks in advance for any advice! Hi there, I'm having a problem with spacing between rows n an html tabel. First let me stress that I am no expert and just know basics to get me by. I have been using this amazing bespoke platform for events websites and adding little bits of html in. The site in question is http://www.ffrp2.fatsoma.com/home.php. I'm sure that I am probably doing this the hard way but im a designer not a coder. My brother built the site builder but he's away skiing so cant ask him and a client wants his site down asap... Here's the code I have used <table width=960px border="0" cellspacing="0" cellpadding="0"> <tr height=332px><td width=960px> <img style="border:0px" src="http://www.fatsoma.com/sitebuilder/./sites/resources/976_resource_55.jpg"/></a> </td> </tr> <tr><td> <table width=960px border="0" cellspacing="0" cellpadding="0"> <tr height=447px> <td width=232px> <table border="0" cellspacing="0" cellpadding="0"> <tr height=232px><td> <a href="button.php"> <img style="border:0px" src="http://www.fatsoma.com/sitebuilder/./sites/resources/976_resource_56.jpg"/></a> </td></tr> <tr height=101px><td> <a href="button.php"> <img style="border:0px" src="http://www.fatsoma.com/sitebuilder/./sites/resources/976_resource_57.jpg"/></a> </td></tr> <tr height=90px><td> <a href="button.php"> <img style="border:0px" src="http://www.fatsoma.com/sitebuilder/./sites/resources/976_resource_58.jpg"/></a> </td></tr> </table> </td> <td width=218px> <table border="0" cellspacing="0" cellpadding="0"> <tr height=175px><td> <a href="button.php"> <img style="border:0px" src="http://www.fatsoma.com/sitebuilder/./sites/resources/976_resource_59.jpg"/></a> </td></tr> <tr height=101px><td> <a href="button.php"> <img style="border:0px" src="http://www.fatsoma.com/sitebuilder/./sites/resources/976_resource_60.jpg"/></a> </td></tr> <tr height=171px><td> <a href="button.php"> <img style="border:0px" src="http://www.fatsoma.com/sitebuilder/./sites/resources/976_resource_67.jpg"/></a> </td></tr> </table> </td> <td width=237px> <table border="0" cellspacing="0" cellpadding="0"> <tr height=90px><td> <a href="button.php"> <img style="border:0px" src="http://www.fatsoma.com/sitebuilder/./sites/resources/976_resource_62.jpg"/></a> </td></tr> <tr height=101px><td> <a href="button.php"> <img style="border:0px" src="http://www.fatsoma.com/sitebuilder/./sites/resources/976_resource_68.jpg"/></a> </td></tr> <tr height=85px><td> <a href="button.php"> <img style="border:0px" src="http://www.fatsoma.com/sitebuilder/./sites/resources/976_resource_64.jpg"/></a> </td></tr> <tr height=171px><td> <a href="button.php"> <img style="border:0px" src="http://www.fatsoma.com/sitebuilder/./sites/resources/976_resource_65.jpg"/></a> </td></tr> </table> </td> </tr> </table> </td> </tr> </table> many thansk in advance for any help offerd Mark Can any body tell me how to delete rows by row id (rows are added/deleted inbetween rows dynamically so I cannt use the index property) Is there a way that anyone knows of to put list items side by side in a row? I'm currently working with some html/css/jquery that allows you to move li elements around and order them. However, instead of being on a new line for each element, I'd like to put several side by side in a row. Is there any way with html/css to make this happen, or is there no way to change the "nature" of li elements? Hey can someone help me and tell me how i can make like a paragraph in boxes that are side by side with borders please. Thank you. Hi there, I'm a bit of a noob to HTML, and I'm working on creating a site for my webcomic. The main portion of the layout has a simple table with a header and footer at the top and bottom rows. It's supposed to look like Instead it looks like The code for the table is this: Quote: <table align="center" cellpadding="0" cellspacing="0" border="0" width="725"> <tr> <td width="725" valign="bottom" border="0"> <img src="/images/header.png" width="725" height="33" /></td> </tr> <tr> <td width="725" bgcolor="0099CC" align="center"> <p>***todays_comics***<p>***first_day*** ***previous_day*** ***next_day*** ***last_day*** </td> <tr> <td width="725" valign="top" border="0"> <img src="/images/footer.png" width="725" height="33" /></td> </tr> </table> Whenever I put the code into an HTML test bed, it works fine, but for some reason refuses to work when I upload it to my FTP. It's driving me crazy. If you could help, I'd really appreciate it. Thanks. How can you make a border appear between rows in a table but not between the columns? Hence you won't notice that there's actally any columns in the table since it's not squared, only the rows are marked, but the columns still are there to prevent the cells from ending up at different horizontal positions at the different rows. I can't figure out how to get IE to position this page at the top. This has consistently worked perfectly in FireFox, no matter what changes I try. It has consistently NOT worked in IE, it starts each page 180 px from the bottom of the header. And please don't rag on me for using tables. This is custom coding for a Perl system we are using. The programs generate tables and rows, and I have to fit my code into the generated pages. Here's the code that's currently running. I know there are duplicates in here, I kept adding things hoping something would wake IE up. It's interesting that with all this redundancy, FireFox has no problems at all. And both the HTML and the CSS validate. The first table is actually in the header, and closed in the footer, so it has to be there. ============================================= <table class="ac_mainbody" cellpadding=0 cellspacing=0 style="position: absolute; left: 260px; width: 550px; top: 180px;"><tr><td> <table width="85%" align="left" border="0" cellpadding="0"> <tr><td class="top_of_page" colspan="4" valign="top" style="vertical-align: top;"> <h5><font face=Georgia color="#990066" size="2"> Offering quality products that bring safety and comfort into your life. We seek out unique equipment and supplies designed to improve the quality of life for those with disabilities and those who assist them.</font></h5></td></tr> <tr><td style="text-align: center;" colspan="4"> ============================================= Everything after this point is lined up correctly in both browsers. It's the starting position that I can't get IE to recognize. I started with just CSS, here's the code: h5.top_of_page {font-size: 12pt; color: #990066; margin: 0px 0px 0px 0px; padding-right: 60px; font-weight: bold; text-align: left; vertical-align: top;} IE ignored everything, including the font color. That's when I started adding names and parameters one at a time, including valign and the font stuff. I also tried <p> and <div> instead of the second table. Same problem. I tried position=”relative” --- everything clumped together at the left, 180px too low on FireFox and 360px too low on IE I tried position=”fixed” --- everything clumped together at the left, and still low on IE Can anyone tell me why there is a space at the bottom of my page between the images in the middle and the bottom image? The page looks fine in Firefox and I cannot figure out why there is a space in IE7. Any suggestions would be greatly appreciated. Thanks Frank http://www.spartafitness.com/home.htm I am working on a layout for a website, I'm not new at all to HTML, it's just been a while. I have a banner taking up the first row of the table(colspan=2), and for the 2nd row, I have a menu and a text region. This 2nd row always has a small space between it and the 1st, even if cellspacing=0. Is there any way to do this with a simple <table>??? Someone told me that using a table would be less effective than using <div>, is this true? If so, how would I do this using <div>. Thank you for any suggestions. Afternoon everyone, I have a table with many rows and a checkbox in the first cell of each row. I want the user to be able to click anywhere on the row and activate the checkbox, so I'm using a label tag in front of each row. The following code works in IE7, but not Firefox or Chrome. Any ideas how to make it work cross-browser? Code: <table>
<label for="X">
<tr>
<td>
<input type="checkbox" id="X"/>
</td>
<td>
THIS TEXT SHOULD ACTIVATE THE LEFT CHECKBOX
</td>
</tr>
</label>
</table>
Thanks! Hi All, Am a bit of a newbie here. I'm having a little problem with a table that I created on Wordpress. After creating the table, the image below shows how it looks like on the Wordpress editor: But, once published, the row alignment is a bit off. Here's the url: http://runfest.my/?page_id=346 Appreciate some advice on what went wrong and how I can fix it. Thanks a bunch! I am working on an application within a website. Most of the HTML for the entire site, I did not create myself, just some HTML and CSS for a specific application. Even in that application, I imported some of the text (which contains HTML tags) from a previous application. So, I only did a small portion of the HTML/CSS. My problem is that when users print out this page in IE6, some of the rows of the main table are missing from the printout. For example, this page: http://www.northcarolina.edu/pe_test/sample_pe.php Does any one have any knowledge of a bug that would cause IE6 not to print some rows? Does any one see any reasons why some rows in the tables (the ones with class='workplan') would skip rows when printing? Thank You. Ok, I am creating a calculator with html and javascript. I am using a table to format the buttons and text displays. The code is posted below with the table itself. It is supposed to be 3 cells height and 1 cell width but it turns out as 2 cells width and 2 cells height. I can't figure out the error in my code so can someone please figure out what is wrong with my tags: HTML Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<style type=text/css>
input
{
background-color: black;
color: white;
}
th
{
background-color: black;
color: white;
}
td
{
background-color: green;
}
</style>
<script type="text/javascript">
var a;
var b;
var c;
var d;
var e;
function inputtext(inputtext)
{
a=document.getElementById("inputcalculation").value;
b=inputtext;
c=a+b;
document.getElementById("inputcalculation").value=c;
}
function Evaluate()
{
d=document.getElementById("inputcalculation").value;
e=eval(d);
document.getElementById("outputcalculation").value=e;
document.getElementById("inputcalculation").value="";
}
</script>
<title>Help-In-Math Calculator</title>
</head>
<body>
<table border="1">
<tr>
<th colspan="11" style="background-color: black">
<center>
<input type="text" id="inputcalculation" value="" />
</center>
</th>
</tr>
<tr>
<td colspan="11" rowspan="5">
<center>
<input type="button" value="1" onclick="inputtext('1')" /> <input type="button" value="2" onclick="inputtext('2')" /> <input type="button" value="3" onclick="inputtext('3')" /> <input type="button" value="+" onclick="inputtext('+')" />
<br />
<input type="button" value="4" onclick="inputtext('4')" /> <input type="button" value="5" onclick="inputtext('5')" /> <input type="button" value="6" onclick="inputtext('6')" /> <input type="button" value="-" onclick="inputtext('-')" />
<br />
<input type="button" value="7" onclick="inputtext('7')" /> <input type="button" value="8" onclick="inputtext('8')" /> <input type="button" value="9" onclick="inputtext('9')" /> <input type="button" value="X" onclick="inputtext('*')" />
<br />
<input type="button" value="0" onclick="inputtext('0')" /> <input type="button" value="." onclick="inputtext('.')" /> <input type="button" value="00" onclick="inputtext('00')" /> <input type="button" value=÷ onclick="inputtext('/')" />
<br />
<input type="button" value="EVALUATE" onclick="Evaluate()" style="background-color: blue"/>
</center>
</td>
</tr>
<tr>
<td colspan=11>
<input type="text" id="outputcalculation" onfocus="blur()" />
</td>
</tr>
</table>
</body>
</html>
Hi. I'm working on a fairly complicated web form and need to align input boxes horizontally across a lefthand column, a multi-row nested table, and a righthand column. This works OK (as long as cellpad and cellspace are set to 0) except that at one point I need to put text in the right-hand column instead of an input box, and this throws the alignment out. The simplified code below shows what I mean. As given below the boxes are aligned properly. But if you comment out the version A row and substitute the version B row, the alignment goes. Can anyone explain why this happens, and whether there's a way round it ? The form in question does have to be a table, by the way. Would be grateful for any suggestions ! Thanks Dedge <form> <table width='100%' cellspacing='0' cellpadding='0' border='0'> <tr> <td>Item name</td> <td rowspan='5'> <table cellspacing='0' cellpadding='0' border='0'> <tr> <td><input name='i1' id='i1' size='1' maxlength='1'></td> <td><input name='i2' id='i2' size='1' maxlength='1'></td> </tr> <tr> <td><input name='i3' id='i3' size='1' maxlength='1'></td> <td><input name='i4' id='i4' size='1' maxlength='1'></td> </tr> <tr> <td><input name='i5' id='i5' size='1' maxlength='1'></td> <td><input name='i6' id='i6' size='1' maxlength='1'></td> </tr> <tr> <td><input name='i7' id='i7' size='1' maxlength='1'></td> <td><input name='i8' id='i8' size='1' maxlength='1'></td> </tr> <tr> <td><input name='i7' id='i7' size='1' maxlength='1'></td> <td><input name='i8' id='i8' size='1' maxlength='1'></td> </tr> </table> </td> <td>Item name</td> <td><input name='ia' id='ia' size='1' maxlength='1'></td> </tr> <tr> <td>Item name</td> <td>Item name</td> <td><input name='ib' id='ib' size='1' maxlength='1'></td> </tr> <tr> <td>Item name</td> <td>Item name</td> <td><input name='ic' id='ic' size='1' maxlength='1'></td> </tr> <!--VERSION A--> <tr> <td>Item name</td> <td>Item name</td> <td><input name='ic' id='ic' size='1' maxlength='1'></td> </tr> <!--END OF VERSION A--> <!--VERSION B--> <!--<tr> <td>Item name</td> <td colspan='2' align='right'>SOME TEXT</td> </tr>--> <!--END OF VERSION B--> <tr> <td>Item name</td> <td>Item name</td> <td><input name='ie' id='ie' size='1' maxlength='1'></td> </tr> </table> </form> Hi. First time posting here, I hope this is a good place to get some quick help as I've hit a problem I can't figure out myself. I'm having problems with a site I'm working on: http://megansmetalworks.com/home.html My problem is this: the row I've created at the top of the page is far thicker in Firefox than in Safari (where it shows up exactly the height I wanted) In FireFox it is HUGE! how do I fix this? I must have made a mistake The code in question is as follows: <frameset rows="70, 20% framespacing="0" frameborder="0"> In safari it appears to show up correctly, 70 pixels tall. But in FireFox it is much larger and takes up the top half of the screen. Can anyone explain why this is? I need the navigation bar at the top to show up at the same height in all browsers. Thanks in advance. So i haven't been able to figure this out and in need of some assistance.Here is the code.want to put them in rows of 2 & columns of 4 but instead it put them in a list.Im sure this is a simple fix.I only have it set up to list 5 products but can set it up for more.If you need the entire page of code just let me know. The webpage for the code http://www.allyugioh.com/products_list <!-- Item loop --> <notag rst:define:img="item1:/ImageUrl" rst:define:notavailable="0" /> <notag rst:ifnot="{img}" rst:define:img="img/noimage.gif" /> <notag rst:if="{item1:/QtyAvailable} le 0" rst:define:notavailable="1" /> <div rst:if="item1:/Title"> <hr/> <a href="#" rst:content="item1:/Title" rst:href:lid="{item1:@id}" rst:href:pagename="product">name</a><br /> <img border="0" height="100" rst:attr:id="thumb{item1:@id}" rst:attr:src="{img}" src="img/imgb.gif" width="100" /><br /> <div class="prod_details_tab"> <b><i rst:content="{item1:/Price@currency}{item1:/Price}">$1</i><br /></b> <a href="#" rst:href:lid="{item1:@id}" rst:href:verb="ATC" rst:href:pagename="cart" rst:ifnot="{notavailable}">add to cart</a> </div> <i rst:content="">$1</i><br /> <i rst:content="">$1</i><br /> <br /><br /> </div> </notag> <!-- Item loop end --> |
|||||||