|
HTML - Cellpadding? Any Such Thing As Cellpadding 'left' Or 'right'?
Basically I am constructing a product page for a client and I wish to bring each row closer togther.
http://www.predatorequipmentni.com/products.php Currently it is looking like this: [] [] [] [] [] [] [] [] [] Where as I wish it to look more like whats shown below: [] [] [] [] [] [] [] [] [] I guess what I am after is a way of reducing the padding on the top and the bottom of the cells. Any pointers would be great! HTML Code: <table width="879" body background="images/whiteblackline.jpg" bordercolor="#000000" bgcolor="#FFFFFF" border="0" align="middle" cellpadding ="35" cellspacing="0">
<tr valign="center">
<td width="293" td align="center"><div align="left">
<p><img src="images/trailers/1.jpg" width="220" height="150" border="0"><br>
<br>
<span class="style3"><strong>GD84GTA</strong> 8’x4’ Mini Plant Trailer. (16” High sides/<br>
Plastic mudguards. 2700kg gross capacity. Includes High Ramp, Bucket Stand and Rear Prop Stands as standard).</span>
<br><img src="images/details.jpg" width="80" height="27" border="0"></p>
</div></td>
<td width="293" td align="center"><div align="left">
<p><img src="images/trailers/1.jpg" width="220" height="150" border="0"><br>
<br>
<span class="style3"><strong>GD84GTA</strong> 8’x4’ Mini Plant Trailer. (16” High sides/<br>
Plastic mudguards. 2700kg gross capacity. Includes High Ramp, Bucket Stand and Rear Prop Stands as standard).</span>
<br><img src="images/details.jpg" width="80" height="27" border="0"></p>
</div></td>
<td width="293" td align="center"><div align="left">
<p><img src="images/trailers/1.jpg" width="220" height="150" border="0"><br>
<br>
<span class="style3"><strong>GD84GTA</strong> 8’x4’ Mini Plant Trailer. (16” High sides/<br>
Plastic mudguards. 2700kg gross capacity. Includes High Ramp, Bucket Stand and Rear Prop Stands as standard).</span>
<br><img src="images/details.jpg" width="80" height="27" border="0"></p>
</div></td>
</tr>
</table>
Similar Tutorialshi all, ive just finished the graphics 4 my layout and assembled them using html tables however when i set the cell padding to anything above '0' all the background img and other images shift out of place. i had all the text looking just right with cellpadding at '10' but all graphics look bad. however with padding at '0' the graphics look good/correct but the text is all pushed up against the left side of the cells. i suppose i can use nbsp's but would just like to get my head around it is their a way to lock the bground pics in place and still have cell padding above '0' without effecting the background images? many thanks So I'm using this frameset on this one page, and I got 2 frames on it, lets call them "menu" and "main", which link to menu.html and main.html respectively. I'm trying to simply make a href in the "main" page that goes to another page which doesn't have the frameset. so if i type <a href="page2.html" target="new">Link</a>, pretty much just using "new" as an arbitrary word here, it does what i want it to do in Firefox (exits the frameset and goes to page2.html). but in other browsers it opens a new tab for page2.html instead of opening in the same tab. I think it has something to do with the target, but i'm not entirely sure what to set it to. So, how do i get it to not open a new tab when i want to exit the frameset? Ok... HOWCOME1 is in I.E., and HOWCOME2 is in FF. Can someone explain this error to me? I've never seen something like this before... Any suggestions, fixes etc. What's going wrong is circled in red... Help needed preferably. http://www.influxgaming.com/ Thanks, in advanced. OK im kinda new to HTML and ive done lots of researching online and online tutorials. What im trying to do is have a button do more than one thing. I cant use PHP or anything other just HTML. Anyone ? Thanks Hi I have this Code in HTML (not XHTML): Code: <html>
<head>
<title>1_html_works_with_both</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
</style>
</head>
<body>
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="100%" height="320" align="left" valign="top" bgcolor="#FF0000"> </td>
</tr>
<tr>
<td width="100%" height="100%" align="left" valign="top"><iframe width="100%" height="100%" frameborder="0" src="http://www.cnn.com/" name="test" id="test" scrolling="auto" /></td>
</tr>
</table>
</body>
</html>
This displays a red space of 320 pixels height at the top of the page, and under it, until the bottom of the page, the CNN website (in an Iframe). This is absolutely no problem and works in Firefox and IE. Now I do the same with XHTML: 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>
<title>2_xhtml_works_with_none</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
</style>
</head>
<body>
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="100%" height="320" align="left" valign="top" bgcolor="#FF0000"> </td>
</tr>
<tr>
<td width="100%" height="100%" align="left" valign="top"><iframe width="100%" height="100%" frameborder="0" src="http://www.cnn.com/" name="test" id="test" scrolling="auto" /></td>
</tr>
</table>
</body>
</html>
This will not work in Firefox and also not in IE. It will display the same fix red space, but the iframe will not fill the page until the bottom of the page. So, there is this known fix: 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>
<title>3_xhtml_works_only_with_firefox</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
html {
height: 100%;
overflow-x: hidden;
}
body {
height: 100%;
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
</style>
</head>
<body>
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="100%" height="320" align="left" valign="top" bgcolor="#FF0000"> </td>
</tr>
<tr>
<td width="100%" height="100%" align="left" valign="top"><iframe width="100%" height="100%" frameborder="0" src="http://www.cnn.com/" name="test" id="test" scrolling="auto" /></td>
</tr>
</table>
</body>
</html>
But: it works only with Firefox. Firefox understands this 100% high table cell as "fill the rest of the page" while IE understands it as "a whole page height, not only the rest of the page". This results in... a scrollbar mess! I hope you can follow... you can test it with the code provided. Thanks for any help! praiser first, sorry if this is in the wrong forum, because it has to be done with javascript or something... anways, i need to make something that will be able to have just a picture, 650 x 650 or so, and when it is clicked, it will change to another (hopefully random) picture. also would like to do something below the picture, a link that you can click to open the picture up in a new page, in mabey a 900 x 900 size, or reverse the clickingof link/pic if that would be easier... i could probably figure out the enlarging, but for the getting new picture i have no clue... any help would be awsome. thanks dear viewers i am new to this forum . i need some help on creating a addon in internet explorer i work for quality check in a limited company. in quality checking procedure i will get a IE page where i have to check whether the spellings are correct and whether the space before after colon and fill stop are correct..... this is my checking procedure. i can find some colon spacing errors by looking at the page. but i dont want to waste my time on finding a bulky pages................... so please any one help me on creating a button or some other source which fits in Internet Explorer when i click that button it should find all the colons and compare the spaces before and after the colon and "?". remaining symbols i can add later...... thnaks in advance Sorry, I have no idea what to call it. The below linked website has a green sort of border on both sides of the main white page: http://www.lusu.co.uk/bowland I was wondering what coding could be used to achieve that effect? Thank you, Suzanne. Hi, My Problem is with ie6 only I have a Menu with Mouse over that changes the background color. I have 6 different menu Home-About-partnership-findadealer-becomedealer-faq-calculator but here's the poroblem: calculator appears twice in the page and in the source code it is there only once. The proof when you try to highlight the word 'calculator ' , both are highlighted. And , Another weird thing if you go on the calculator Page: Everything is ok Any help would be appreciated Thanks Hi the phone number box is not placed correctly as you can see he http://extramoney.net16.net How do i fix it ? There must be a small error in the code .. HTML code he <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd"> <HTML xmlns="http://www.w3.org/1999/xhtml"><HEAD><TITLE>Exclusive - Template</TITLE> <META http-equiv=Content-Type content="text/html; charset=utf-8"> <STYLE type=text/css>#mainWrapper { MARGIN-TOP: 0px; FONT-SIZE: 12px; MARGIN-LEFT: auto; WIDTH: 732px; COLOR: #333333; MARGIN-RIGHT: auto; FONT-FAMILY: Arial, Helvetica, sans-serif } BODY { MARGIN-TOP: 0px; BACKGROUND-IMAGE: url(repeater-orange.jpg); BACKGROUND-REPEAT: repeat-x } #video-area { BACKGROUND-IMAGE: url(../ExclusiveTemplate/HTML/images/video-area-bg.jpg); BACKGROUND-REPEAT: no-repeat; HEIGHT: 385px } #footer { BORDER-TOP: #cccccc 1px dotted; MARGIN-TOP: 20px; PADDING-BOTTOM: 10px; PADDING-TOP: 10px } .style1 { FONT-WEIGHT: bold; FONT-SIZE: 10px; COLOR: #666666 } </STYLE> <META content="Created with Trellian WebPage" name=description> <META content="MSHTML 6.00.2900.6036" name=GENERATOR></HEAD> <BODY> <DIV align=center> <TABLE style="Z-INDEX: 101; LEFT: 331px; WIDTH: 589px; POSITION: absolute; TOP: 103px; HEIGHT: 351px" height=351 cellSpacing=0 cellPadding=0 width=589 border=0> <TBODY> <TR> <TD><IMG style="WIDTH: 596px; HEIGHT: 334px" height=300 alt="" hspace=0 src="7fa10df874.jpg" width=600 border=0></TD></TR></TBODY></TABLE><IMG height=87 alt="" hspace=0 src="header-orange.jpg" width=732 border=0><BR> <DIV id=mainwrapper style="WIDTH: 733px; HEIGHT: 98.9%"> <DIV align=center><IMG height=385 alt="" hspace=0 src="video-area-bg.jpg" width=732 border=0></DIV> <P align=center><FONT face=Default size=2><FONT face=Impact><FONT size=3><FONT face="Gill Sans MT" color=#ff0000 size=4><STRONG>Discover The Secret $35K/Month System That <U>WILL</U> Separate You From The Pack!</STRONG></FONT> <BR></FONT></FONT><FONT face="Tw Cen MT"><FONT face="Lucida Sans Unicode" color=#000000><FONT color=#000000><STRONG><FONT face="Gill Sans MT" size=3>(The Very Good News Is That Im Gonna Reveal It To You For FREE! This Is Unheard Of..!)</FONT></STRONG><BR>You Will Be Getting Instant Access To The Full 1on1 Training Course That <BR>Others Have Paid Upto $1,997 To Use For <U>FREE</U>! This Wont Last Long, Sign Up Today...<BR></FONT> <SCRIPT src="http://www.jotform.com/min/g=jotform&3.1.9" type=text/javascript></SCRIPT> <SCRIPT type=text/javascript> JotForm.init(function(){ $('input_7').hint('ex: myname@example.com'); }); </SCRIPT> <LINK href="http://www.jotform.com/css/styles/form.css?v3.1.9" type=text/css rel=stylesheet><LINK href="http://www.jotform.com/css/styles/jottheme.css" type=text/css rel=stylesheet><LINK href="http://www.jotform.com/css/calendarview.css?v3.1.9" type=text/css rel=stylesheet> <STYLE type=text/css>.form-label { WIDTH: 100px! important } .form-label-left { WIDTH: 100px! important } .form-line { PADDING-RIGHT: 10px; PADDING-LEFT: 10px; PADDING-BOTTOM: 10px; PADDING-TOP: 10px } .form-label-right { WIDTH: 100px! important } .form-all { FONT-SIZE: 12px; BACKGROUND: #ffffff; WIDTH: 275px; COLOR: #000000! important; FONT-FAMILY: "Trebuchet MS" } </STYLE> <FORM class=jotform-form id=3155437226 name=form_3155437226 accept-charset=utf-8 action=http://www.jotform.com/submit.php method=post><INPUT type=hidden value=3155437226 name=formID><FONT size=3> </FONT></P> <DIV class=form-all> <UL class=form-section> <LI class=form-line id=id_9><LABEL class=form-label-left id=label_9 for=input_9><FONT size=3>First Name<SPAN class=form-required>*</SPAN> </FONT></LABEL> <DIV class=form-input id=cid_9><INPUT class="form-textbox validate[required]" id=input_9 size=25 name=q9_firstName><FONT size=3> </FONT></DIV></LI> <LI class=form-line id=id_7><LABEL class=form-label-left id=label_7 for=input_7><FONT size=3>E-mail<SPAN class=form-required>*</SPAN> </FONT></LABEL> <DIV class=form-input id=cid_7><INPUT class="form-textbox validate[required, Email]" id=input_7 size=25 name=q7_email><FONT size=3> </FONT></DIV></LI> <LI class=form-line id=id_8><LABEL class=form-label-left id=label_8 for=input_8><FONT size=3>Phone Number<SPAN class=form-required>*</SPAN> </FONT></LABEL> <DIV class=form-input id=cid_8 style="WIDTH: 156px; HEIGHT: 41px"><SPAN class=form-sub-label-container><INPUT class="form-textbox validate[required]" id=input_8_area size=3 name=q8_phoneNumber8[area]><FONT size=3> - </FONT><LABEL class=form-sub-label id=sublabel_area for=input_8_area><FONT size=3><FONT size=1>Area Code</FONT> </FONT></LABEL></SPAN><SPAN class=form-sub-label-container><INPUT class="form-textbox validate[required]" id=input_8_phone size=8 name=q8_phoneNumber8[phone]><FONT size=3> </FONT><LABEL class=form-sub-label id=sublabel_phone for=input_8_phone><FONT size=3><FONT size=1>Phone Number</FONT></FONT></LABEL></SPAN></DIV></LI> <LI class=form-line id=id_2> <DIV class=form-input-wide id=cid_2> <DIV class=form-buttons-wrapper style="TEXT-ALIGN: center"><FONT size=3><INPUT type=image height=69 alt="Submit Form" width=270 src="get-instant-access.jpg" border=0> </FONT></DIV></DIV> <LI style="DISPLAY: none"><FONT size=3>Should be Empty: </FONT><INPUT name=website><FONT size=3> </FONT></LI></UL></DIV><INPUT id=simple_spc type=hidden value=3155437226 name=simple_spc> <SCRIPT type=text/javascript> document.getElementById("si" + "mple" + "_spc").value = "3155437226-3155437226"; </SCRIPT> <FONT size=3></FONT></FONT></FONT><BR></FONT><IMG style="Z-INDEX: 102; LEFT: 362px; POSITION: absolute; TOP: 675px" height=111 alt="" hspace=0 src="arrow-hand.JPG" width=128 border=0> <IMG style="Z-INDEX: 103; LEFT: 781px; POSITION: absolute; TOP: 672px" height=111 alt="" hspace=0 src="arrow-hand1.JPG" width=128 border=0> <TABLE style="Z-INDEX: 104; LEFT: 371px; TOP: 853px" height=16 cellSpacing=0 cellPadding=0 width=506 border=0> <TBODY> <TR> <TD> <P class="style21 style1" align=center><FONT face=Arial><FONT color=#000000 size=2>The Goal Is To Create The Next 20 "Internet Big Shots" This Year!<BR>(Your Background, Experience, Online Skills, Looks, Doesnt Matter)<BR></FONT><BR></FONT>Michael?s Millionaire Mentoring - Home - Privacy - Disclaimer - All Rights Reserved 2010</P></TD></TR></TBODY></TABLE></FORM></DIV></DIV></BODY></HTML> Hi All, I'm working on http://www.thesuccessleague.com/hbbtsstart.php and I'm trying to get the red text box on the left (with the picture of a woman) at the very top. I'm sure there's a cleaner way to do it (I'm not an expert at div tags yet), so I put the text box in a table and put that table in another table (as you can see in the code). What code do I have to use to anchor that red text box to the top of that left column? Do I need to use div tags? And if so, how do I anchor it to the table (and not to specific coordinates measurade against the top and left margins)> Thanks for your help! Hi , I have an odd HTML question. In my company we make procedures (stuff that we think we need written down in case we need to repeat it), which we update on a regular basis. Whenever we go to do an install, update, fix, etc. and we need a procedure, we print it out and then head off with it (we make red lines as necessary.) All of these are in HTML and stored in CVS. One of the engineers (she is not terribly familiar with HTML and turned to me) asked me if I could make a little "box" to the left of a list. The steps of the procedure are a bunch of <li> tags, having a nice box to the left to check it off as you go through them would be great. This stumped me. The best that I could do was make a one-celled table inside the <li> tags (the HTML for which I've posted) in order to get the impression of a "box" where you can check off a step that you just completed. Is there any way to put that box on the left? If you look at the end of this post I made a simple ASCII representation of what I would like to accomplish. Code: <html>
<head>
<title>
Example
</title>
</head>
<body>
<ol>
<li>
<table border="1">
<tr>
<td>
</td>
</tr>
</table>
Do stuff...
</li>
<li>
<table border="1">
<tr>
<td>
</td>
</tr>
</table>
Do stuff...
<ol type="a">
<li>
<table border="1">
<tr>
<td>
</td>
</tr>
</table>
Do sub-step...
</li>
<li>
<table border="1">
<tr>
<td>
</td>
</tr>
</table>
Do sub-step...
</li>
<li>
<table border="1">
<tr>
<td>
</td>
</tr>
</table>
Do sub-step...
</li>
</ol>
</li>
<li>
<table border="1">
<tr>
<td>
</td>
</tr>
</table>
Do stuff...
</li>
</ol>
</body>
</html>
Code: +---+
| | 1) Do stuff...
+---+
+---+
| | 2) Do stuff...
+---+
+---+
| | a) Sub-step...
+---+
+---+
| | b) Sub-step...
+---+
+---+
| | c) Sub-setp...
+---+
+---+
| | 3) Do stuff...
+---+
In html left to right <marquie behaviour but i want right to left the text comes from right to left and left standard positin whch command do i need to use? please provide thanks for helping Good day , I want to create a menu in my div block but the menu will be like this Categorie <-- this is the title Plastic <-- this is 3 categorie hard <-- type of plastic soft wood metal my problem is that I would like that when you click on a categorie the type would appear and the other categories would go down to give some room for the type. I tryed to use a menu builder from coffecup but it wont put under like I would like. Can someone help me please . thanks in Advance Marc I want to add a left vertical sub navigation... but i want it to look similar to this one! RamVideos I dont know where to start... Thanks In Advance! people are telling me that have to horizon scroll (left to right) to see this page: http://www.girlsincsoaz.org I tried it on different machines, including a laptop and I don't have to, what can be the problem? TIA The layout of my page, like that of many pages, consists of a bunch of divs inside divs. Whenever I specify the width or height of a div, there appears a space to its left, three pixels wide. This gap also appears when I substitute a standard image (img) for a div. Some of these divs are floated left; others are not. In the latter case, floating left actually gets rid of the space, but causes other problems as I don't really want those ones floated left. Setting the borders, margins, or padding to zero (or a negative number) does not affect the 3px gap. I am using IE7. Hi, I want to put images on the top left and topright corners of my website, but I want the images to rotate (they'd change when the page reloads).. How would I do that? hello the original website is 'http://www.buddysauctions.com/ and when u scroll down you can see that the "Member Login" box is on the left. I wanna move it to the right like me photoshop print screen i know that i have to cut the php code from my php file and create a new php file and put it in but i dont know how to put it exactly where my printscreen shows. thanks a lot for your interest i hope you can help me ) thanks again edit: i also would like to have some empty boxed under the member login so i can put adverts in them edit2: my member login box as you can see in the printscreen PHP Code: <tr> <td><FORM name=loginForm action="login.php" method=post> <div align="center"></div> <table width="262" border=0 align=center cellpadding=5 cellspacing=0> <tbody> <tr valign=center> <?php if(!isset($_SESSION["userid"])) { ?> <td colspan="2" background="http://www.overclock.net/images/bgyell2.gif" class="sideheadingtd" ><strong><img src="http://www.overclock.net/images/squareswhite.gif" width="10" height="12" align="absmiddle"> <font size="2" face="Arial, Helvetica, sans-serif" font color="#ffffff">Member Login</font></strong></td> </tr> <tr valign=center> <td bgcolor="#f5f5f5"> <div align=right><font color="#000000" size="1"><strong><font face="Verdana, Arial, Helvetica, sans-serif">Username</font></strong></font></div></td> <td width="97" bgcolor="#f5f5f5"><font color="#000000"> <input name=UserName class="box1" size="13"> </font></td> </tr> <tr valign=center> <td bgcolor="#f5f5f5"> <div align=right><font color="#000000" size="1"><strong><font face="Verdana, Arial, Helvetica, sans-serif">Password</font></strong></font></div></td> <td bgcolor="#f5f5f5"><font color="#000000"> <input name=Password type=password class="box1" size="13"> </font></td> </tr> <tr align=right> <td colspan=2 bgcolor="#f5f5f5"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="67%"><p class="style2"><a class="insidelink" href="signup.php">:: Signup Now::</a><br> <a class="insidelink" href="lostpassword.php">:: Lost Password ::</a></p></td> <td width="33%"> <div align="left"> <font color="#000000"> <input type="submit" name="Submit" value="Sign In" class="btn"> </font></div></td> </tr> </table></td> <?php }?> </tr> <tr align=right> <td colspan=2> </td> </tr> </tbody> </table> <div align="center"></div> </FORM></td> </tr> I'm wondering how I would fill in the left and right side of the body. Right now it's centered at 800px so I have the left and right side just white. *--><body> <div id="page" align="center"> <div id="content" style="width:800px"> I'm not sure what else you'd need to see, so please let me know. For example this news site: www.kstp.com I'm wondering how I would get the blue sides like this site has. Thanks in advance |
|||||||