Cant eliminate empty space

mat420 · March 1, 2011

I cant manage to get rid of this empty space between Request Call Back and the stupid request call back form!

http://www.doctorpcrepair.com/contact.php

Anyone have any idea? I was going to put this in html but I figure its probably the CSS/externally stored CSS calling messing things up.

thanks a million

cssfreakie · March 1, 2011

Using tables to layout forms (or anything really), is a concept from the stone ages. Tables are for displaying data.

Anyways, Your table at the bottom doesn't have a width. if you wan't to stick with these tabular designs, add width to the row.

For instance add a width of 115px to the first td:

<label for="Message">Enter letters below:</label>

</td>

But I would not use tables for this

mat420 · March 1, 2011

what else would i use? i added widths, theres still a big gap.

mat420 · March 1, 2011

does appear to be the table thats the problem though, i got rid of <table width="250px" border="0">

and the gap is gone. hm. not the text boxes arent aligned though

cssfreakie · March 1, 2011

well if you did exactly what i told

<label for="Message">Enter letters below:</label>

</td>

and leave the rest of the code the same it would have looked good/better.

But instead of a table you might want to use a <ul> instead. have a look here: http://wufoo.com/gallery/templates/forms/emergency-contact-and-medical-info/

Those guys made there business of it.

mat420 · March 1, 2011

i did do only what u said, reuploaded and it wasnt any different. i then continued to mess around with it tho, which may be what u saw.

mat420 · March 1, 2011

as soon as i add <table width="250px" border="0">

the big space starts again.

cssfreakie · March 1, 2011

you havent added any width as far as i can see at the moment to the code. Use firebug to inspect the elements and experiment with the widths

Right now i have to assume you did something but the code on the page doesn't show it.

mat420 · March 1, 2011

</tr>

<tr>

<label for="name">Phone #:</label>

</td>

</td>

</tr><br>

<tr>

<label for="phone">Verify Phone #:</label>

</td>

mat420 · March 1, 2011

wait isnt that wrong?

style in a td < > ? hm idk crap about code ;/

cssfreakie · March 1, 2011

<td valign="top" style="width: 115px;">

wait isnt that wrong?

style in a td < > ? hm idk crap about code ;/

if you don't know crap about code, don't offer clients you can do it. But that's just my opinion. Since i saw you offered web stuff.

Yes any element can be styled so also a <td>

I just added both width to the <table style="width:250px">

and width to the <td style="width:115px">

mat420 · March 1, 2011

can you tell me what im missing please because i dont see it.

i added width px 115 to every td. how is adjusting the tables td's width going to eliminate that gap btw please?

<p><table width="250px" border="0">
<form method="POST" action="<?php echo $SERVER['SCRIPT_URL']?>#form"> 

</tr>
<tr>
<td valign="top" style="width: 115px;">
  <label for="name">Phone #:</label>
</td>
<td valign="top" style="width: 115px;">
  <input type="text" name="email1" id="email1" MAXLENGTH=12 size=16 value="<?php if (!empty($_POST['email1'])) { echo  $_POST['email1']; } ?>" />
</td>
</tr><br>
<tr>
<td valign="top" style="width: 115px;"> 
<label for="phone">Verify Phone #:</label>
</td>
<td valign="top" style="width: 115px;">

  <input type="text" name="email2" id="email2" MAXLENGTH=12 size=16 value="<?php if (!empty($_POST['email2'])) { echo  $_POST['email2']; } ?>" />
</td>
</tr><br><br></table>

mat420 · March 1, 2011

apologize if that sounded rude, i didnt mean it to. i just have no idea what im not doing correctly.

cssfreakie · March 1, 2011

I just did this: Like i just already said, I only added 115px, to the TD that was causing troubles so not to them all

The code you gave above btw is of the form at the right side, whilst you were talking about the REQUEST CALLBACK form.

So i will give the code that should work. Notice I only changed the 2 values. (table width and td width) you can apply the same logic to the form at the right side.

<table style="width:250px">
<tbody><tr><td valign="top" style="width:115px;">
  <label for="Message">Enter letters below:</label>
</td>
<td valign="top"><input name="captcha2" size="8">
</td> 
</tr><tr>
<td valign="top"><span class="class2">
  <label for="Message"><a href="/contact.php?captchawav=1&captchasalt=1038284">Listen To This</a> / <a href="javascript:location.reload(true);">Refresh</a></label></span>
</td>
</tr>
<tr>
<td colspan="2" style="text-align: center;">
<img style="vertical-align: middle;" src="/contact.php?captchaimg=1&captchasalt=1038284">  

  <input name="send2" value="Submit" type="submit">
<font color="red"><b></b></font><b></b>

</td>
</tr>
</tbody>
</table>

[attachment deleted by admin]

mat420 · March 1, 2011

space isnt going anywhere.

thats a whole table underneith where the space is that im talking about, u know i mean the space bteween request call back (flash) and phone# (textfield) right?

thanks x999

<table style="width:250px">
<tbody><tr><td valign="top" style="width:145px;">
  <label for="Message">Enter letters below:</label>
</td>
<td valign="top"><input name="captcha2" size="8"/>
</td> 
</tr><br>
<tr>
<td valign="top"><span class="class2">
  <label for="Message"><a href="<?php echo captchaWavUrl()?>">Listen To This</a> / <a href="javascript:location.reload(true);">Refresh</a></label></span>
</td>
</tr>
<tr>
<td colspan="2" style="text-align:center">
<img style="vertical-align: middle" src="<?php echo captchaImgUrl()?>">  

  <input type="submit" name="send2" value="Submit"/>
<font color="red"><b><?php
if (isset($errors2)) {
foreach ($errors2 as $error) {
	echo("<p>$error<p>\n");
}
}
?></font></b></p>

</td>
</tr>
</tbody>
</table>
</form>

cssfreakie · March 1, 2011

Ah ok, well next time if you have a css question add an image with some arrows so we know what you talking about. would be great saves everybody time. And maybe use #id's in your design, helps targeting too for css.

I really suggest you read a bit about tables because you clearly didn't, just google tabel design etc.

Also i can really recommend using firebug for firefox. that way you can apply style while viewing.

see attachment, telling me after a little experimenting that applying 215px to only your <table> would be enough.

[attachment deleted by admin]

mat420 · March 1, 2011

thx

cssfreakie · March 1, 2011

no problemo hope it helped. developing css without firebug, will cost you loads of time extra

mat420 · March 2, 2011

anyone else please? dont know if im gonna get replied now that were on the 2nd page. trying firebug now, will post back if i succeed but i dbt it.

cssfreakie · March 2, 2011

Lol dude you said thanks, I assumed that would have fixed it. At least it does at my place.

did you gave the table tag the width i said? See the image in the post above.

I gave it 215 px.

in case you have difficulty reading. i did this....

If something doesn't work say it!

mat420 · March 2, 2011

nah i said thanks cuz u tried and didnt realize the actual problem. looking at the picture u posted, im not sure u understand my problem, probably my fault for not putting a picture. the rectangle (aka empty space) is what im trying to get rid of. see picture attached pelase.

[attachment deleted by admin]

cssfreakie · March 2, 2011

lol ok, that is something completely different indeed. btw Did you install firebug? yes? no? and what did you see....

did you even look at your own code or not? I really recommend you don't build any website for anyone for a fee until you master these basics. I don't mean that rude, but i assume you don't like to get clients up your *** because you are not able to do what they want.

if you see the code below do have you any idea what is causing the extra space?

    
<h2>..</h2>
<div class="box_image_wrapper"></div> 
<br>
<br>
<br>
<table style="width: 250px;"></table>

indeed you have 3 breaks <br> in there, besides that you have a <h2> element which at default has space below it, so if you want to get rid of that set margin-bottom to some value you like.

and again if you would have used firebug, you could have simply seen this deleted in browser view the breaks, et voila, space is gone.

mat420 · March 2, 2011

lol!! i seen those 3 brs in firebug, i dont see them in my code though haha.

im going to look again, i dont think those three br's are there though.

cssfreakie · March 2, 2011

can't it be something with your wysiwyg editor. anyway you have quite some whitespace in your html. maybe clear those and start and the next line instead instead of skipping lines. But it could be quite some things, but those ,<br> are interpreted there.

mat420 · March 2, 2011

i think i got rid of all the white space right after posting that lst msg here

im not using an editor btw, notepad ++ and notepad/wordpad

i can, make, no, sense, of this.

i think the key factor here is that when i get rid of the "table" that the space goes away, that doesnt answer the question for u?

ugh i really dont feel like learning how else i can align everything right just because of a stupid space.

everything i try to do with this site has already become an hour long process per stupid feature/fix :/

src="reqcallback.swf"
          bgcolor="#FFFFFF"
          quality="high"
          seamlesstabbing="false"
          allowscriptaccess="samedomain"
   wmode="transparent"
        >
          <noembed>
          </noembed>
        </embed>
      </object></h2>
<div class="box_image_wrapper">
                </div>
<table style="width:250px">
<form method="POST" action="<?php echo $SERVER['SCRIPT_URL']?>#form"> 

<tbody><tr><td valign="top" style="width:115px;">
  <label for="name">Phone #:</label>
</td>
<td valign="top" style="width: 115px;">
  <input type="text" name="email1" id="email1" MAXLENGTH=12 size=16 value="<?php if (!empty($_POST['email1'])) { echo  $_POST['email1']; } ?>" />

Sign In

Cant eliminate empty space

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Important Information