HTML - Spacing In Between Text
Hello,
I have a table text spacing problem. I'm trying to have two text elements (p's, spans's, whatever) stacked vertically or as close as possible underneath one of other. I cannot for the life of me remove the gap in between. I've tried margins, padding, cellpadding/cellspacing, border-collapse, and still, nothing works. I've attached an example using primitive HTML. Anyone have any ideas? The code: Code: <table width="650" border="0" cellspacing="0" cellpadding="0"> <tr> <td>TEXT</td> </tr> <tr> <td>TEXT2</td> </tr> </table> Thanks! Edit: Line-height did the trick. Similar Tutorialshi i am new to HTML, but a quick learner. i am really stuck though.....i am trying to change the font and size on a simple paragraph on my website.....here is the HTML i put in <p align=center> <font size="4" face="century gothic" > ********** my text ********* l</font> but now the lines in the paragraph are really squished together vertically......is there a HTML code i am missing to add in here is a link to see what it looks like.....http://www.cocosshoppe.com/store/eco...?idCategory=76 Please find it in your really smart hearts to help me ;J i want to space out my text a bit more, i think it's too close together but i dont' know how to fix it, please help! http://leilanimunter.com/news.htm THANK YOU!!! I am designing a site that uses a size-specific template, therefore, the size cannot change vertically so I have utilized a scroll bar in my body text. <table height="340" cellpadding="0" cellspacing="0" style="width:400px;"> <tr> <td><div style="overflow:auto; height:340px; cellpadding:0; width:519px"> body text goes here The scrollbar works fine, but the text butts up right against it. Changing the cellpadding does not give me space between the text and scrollbar, just between the table edge and the scrollbar. [the scrollbar fits inside the table size]. Is there a way to insert extra space between the right side of the text and scrollbar? Thank you for your help! Staci Hi, I have a site that goes over about 3 pages in length and in the IE the page is longer than in firefox. This is really annoying when you have next to the page a sidebar that is supposed to have the same length as the page but in the IE the sidebar does not reach the end of the page (because the page is longer due to larger spacing). To me it seems that IE makes more spaces between the text lines like h1, h2, p, etc. Is this a common problem and is there any solution to this? Having a problem with divisions, as far as i am aware the contents of a division portrays the length of any division. Correct? Is there any way i can make the division wider to enable me to have space either side of my text? Thanks CW Im trying to create a simple thing for my business. What im trying to do is have the image of each of my employees and under it have their name and other info. I want the images side by side with some space and able to put their info under it. Can someone help me with a html code? thanks! Alright i'm having a little trouble. When I add stuff to the side boxes, they are farther down then i want them to be, here is a pic: I'm wanting to move it up some, but I don't know how, I have been trying for a long time though. Here is the HTML Code: Code: <div class="box2 margin1"> <div class="tail-right"> <div class="corner-right-bottom"> <div class="corner-left-bottom"> <div class="corner-right-top"> <div class="corner-left-top"> <div class="indent"> <h3><span><span>Partners</span></span></h3> <div class="indent2"> <center><a href="http://www.elitepvpers.de"><img src="http://img230.imageshack.us/img230/2364/31421454.png" border="0"></a></center> <center><a href="http://www.4botters.com"><img src="http://img814.imageshack.us/img814/2599/88029646.png" border="0"></a></center> <div id="vent"><div style="font-weight: bold; font-size: 12px; text-align: center;"><a href="ventrilo://94.75.238.76:4696/servername=EQGVent" style="text-decoration: none;"></a></div></div> </div> </div> </div> </div> </div> </div> </div> </div> Here is the CSS: Code: .box2 {background:#bec2c5 url(images/box2-bottom-tail.gif) bottom repeat-x;} .box2 .tail-right {background:url(images/box2-right-tail.gif) right repeat-y;} .box2 .corner-right-bottom {background:url(images/box2-corner-right-bottom.gif) right bottom no-repeat;} .box2 .corner-left-bottom {background:url(images/box2-corner-left-bottom.gif) left bottom no-repeat;} .box2 .corner-right-top {background:url(images/box2-corner-right-top.gif) right top no-repeat;} .box2 .corner-left-top {background:url(images/box2-corner-left-top.gif) left top no-repeat; width:100%;} .box2 .indent {padding:4px 6px 6px 4px;} .box2 .indent2 {padding:15px 12px 0px 6px;} Any help will be greatly appreciated. Thank you. Hey folks... I've searched and searched for an answer for this, but with no luck. Probably because I don't know how to exactly describe my problem. Anyway, the issue is my page is displaying differently in IE and Firefox (surprise!). The spacing between the top image and the body divs are different. I'm not sure if it's an HTML issue or a CSS one. The page in question is: http://www.project-43.com/ The CSS file is he http://project-43.com/images/style.css It displays the way I want it too in Firefox. If you look at it in IE, you'll see the top image looks short, but that is because the spacing between the left menu area and the body on the right is too big. I appreciate any pointers that you might be able to offer. Thanks! Ok so I'm learning along the way by playing around with what my web designer started. I'm having trouble working out what part of the html does the spacing between my text and the input box. Here's what I'm stuck at: You can see how where it says 'click for more fonts' the box isn't in line with the others. Any help would be much appreciated.... I'm starting to go cross-eyed lol. Hello Everyone: I am a novice HTML user - I use it to create a Help file (for an MS/Access database), using HTML Help Workshop. My question concerns line spacing, using the following code: <b><u>Server:</u></b> <ul> <li>First List item...</li> </ul> Using this code, there will be a blank line between "Server" and "First List item...". Is it possible to eliminate this line and have the list start in the next line after "Server"? Thanks. . . Tony N. I've set up a <ul> with some breaks between each <li>. The spacing differs between FF and IE. It seems that the first <br> is ignored by IE, but not FF. Anyone know why, or a workaround? Thanks. i want to move and image up at least -2px is that possible in html or css? thanx in advance... Here's a screenshot of what it's doing: I want to eliminate the spacing all together so my Flash element can sit exactly within the div. If there's a better way of positioning the Flash please tell me! I've goggled around already and implemented a few solutions, but I can't find anything that will solve it. The page I'm having problems with is he http://www.team1225.com/bio.php Towards the bottom there's a member generated bios section. Each of those green boxes should be touching like the two orange boxes are touching. That's what I'm having problems with. Firefox renders the page correctly but Internet Explorer struggles to. I've spent a couple of hours narrowing down the problem. Sorry if the html output is hard to read, its php generated. Code: <h3 class="bio" id="1bio"><p class="biot">Brian <img class="rank" src="img/prog.png"/></p></h3> <div id="biobr" class="content"> <table border='0' cellspacing='0' cellpadding='0' width='100%'> <tr> <td>Pecion sdejf asdf eeeaw dfalkdfjadsa asfaf cEqasdf.</td> <td>Pecion sdejf asdf eeeaw dfalkdfjadsa asfaf cEqasdf.</td> </tr> <tr> <td>Pecion sdejf asdf eeeaw dfalkdfjadsa asfaf cEqasdf.</td> <td>Pecion sdejf asdf eeeaw dfalkdfjadsa asfaf cEqasdf.</td> </tr> <tr> <td>Pecion sdejf asdf eeeaw dfalkdfjadsa asfaf cEqasdf.</td> <td>Pecion sdejf asdf eeeaw dfalkdfjadsa asfaf cEqasdf.</td> </tr> </table> <hr align='center' style='height: 1px; overflow: hidden; line-height:1px; border-bottom: 0px; width: 80%; color: #808080;'/> <p align='center' style='color: #808080;'><i>Comment:</i></p> <p style='color: black; margin: 1em; border: 1px solid #808080;'>Pecion sdejf asdf eeeaw dfalkdfjadsa asfaf cEqasdf.</p> </div> </div> The css for div.content is: Code: div.content { margin: 0px auto; background-color: white; color: black; width: 80%; } The <div id="biobr" class="content"> part is the div field that opens and closes that holds the bio for the user. This javascript action is not related my problem. If I take out all the p, div, and hr tags in that <div id="biobr" class="content"> tag it works and all the green boxes are touching under Internet Explorer. Firefox keeps working like it always does. I've seen problems discussed like this so I think there's a fix. Thanks for any help, Alex I am a flash developer and our client wants this site to be built using mainly html, I am pretty good with html but not even close to an expert. I have built a site with Flash vertical and horizontal nav bars above and beside my html content. In Firefox and Safari the site looks perfect, however in IE6 & IE7 there is about a 5 pixel gap between my vertical menu bar and the rest of my content. I have tried everything I know to correct this problem... Any Ideas? They would be greatly appreciated.... Site Link http://www.sacreative.com/education 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 Just learning this stuff. I am having trouble controlling space between lines. My HTML coding is resulting in too much space between lines. I am afraid I have no idea how to control spacing. I have fiddled with different coding. Here is the current version: <td class="headerbg" colspan="2" width="600"> <div align="left"><p style="font-family:verdana; color:00bfff; font-size:30px;" >the amazing alexander technique </p><p style="font-family:verdana; color:00bfff; font-size:20px;" >so much more than 'posture' and pain relief </p> </div> </td> Thanks for any help. Pointing me to resource where I can read the solution would be great. Hello all, I have recently swapped from IE to Firefox, and realised in the process that my navigation bars have excessive spacing when displayed through firefox. The site is http://www.aboutfarthings.co.uk I have had a try but keep messing up the formatting. The site was created/is edited using Namo Web Editor 6.0 , and the nav bars are Namo standard bars. Any help/advice appreciated. Colin G. Hey, How can I get rid of the space in between these 2 tables (see image), I don't know whether it's spacing or padding or something else. I've tried a few things but they didn't work. Any suggestions? I want to remove the space between the top frame and the main frame, but the div on the main frame doesn't start on the top of the frame... http://black1c3.awardspace.com how can i do it?? |