HTML - Big Empty Space!
Hi all!
New to this html stuff.. and need a little direction! I added a dynamic drive slideshow to my webpage (that is still very work-in-progress!) and managed to move it down the page where it's supposed to go, but now I have this big blank spot at the top of the page.. oi! Any and all help will be muchly appreciated! Here is the link: http://daps.ca/painting/test/ and here is the code: <html> <head> <script type="text/javascript"> var fadeimages=new Array() //SET IMAGE PATHS. Extend or contract array as needed fadeimages[0]=["http://usera.imagecave.com/paye22/paintweb/pic1.gif", "", ""] //plain image syntax fadeimages[1]=["http://usera.imagecave.com/paye22/paintweb/pic2.gif", "http://www.cssdrive.com", ""] //image with link syntax fadeimages[2]=["http://usera.imagecave.com/paye22/paintweb/pic3.gif", "http://www.javascriptkit.com", "_new"] var fadebgcolor="6aa4b2" var fadearray=new Array() //array to cache fadeshow instances var fadeclear=new Array() //array to cache corresponding clearinterval pointers var dom=(document.getElementById) var iebrowser=document.all function fadeshow(theimages, fadewidth, fadeheight, borderwidth, delay, pause, displayorder){ this.pausecheck=pause this.mouseovercheck=0 this.delay=delay this.degree=10 //initial opacity degree (10%) this.curimageindex=0 this.nextimageindex=1 fadearray[fadearray.length]=this this.slideshowid=fadearray.length-1 this.canvasbase="canvas"+this.slideshowid this.curcanvas=this.canvasbase+"_0" if (typeof displayorder!="undefined") theimages.sort(function() {return 0.5 - Math.random();}) //thanks to Mike (aka Mwinter) this.theimages=theimages this.imageborder=parseInt(borderwidth) this.postimages=new Array() //preload images for (p=0;p<theimages.length;p++){ this.postimages[p]=new Image() this.postimages[p].src=theimages[p][0] } var fadewidth=fadewidth+this.imageborder*2 var fadeheight=fadeheight+this.imageborder*2 if (iebrowser&&dom||dom) document.write('<div id="master'+this.slideshowid+'" style="position:relative;top:550px;left:50px;width:'+fadewidth+'px;height:'+fadeheight+'px;overflow: hidden;"><div id="'+this.canvasbase+'_0" style="position:absolute;top:550px;left:50px;width:'+fadewidth+'px;height:'+fadeheight+'px;top:0;lef t:00;filter:progidXImageTransform.Microsoft.alpha(opacity=10);opacity:0.1;-moz-opacity:0.1;-khtml-opacity:0.1;background-color:'+fadebgcolor+'"></div><div id="'+this.canvasbase+'_1" style="position:absolute;top:550px;left:50px;width:'+fadewidth+'px;height:'+fadeheight+'px;top:0;lef t:0;filter:progidXImageTransform.Microsoft.alpha(opacity=10);opacity:0.1;-moz-opacity:0.1;-khtml-opacity:0.1;background-color:'+fadebgcolor+'"></div></div>') else document.write('<div><img name="defaultslide'+this.slideshowid+'" src="'+this.postimages[0].src+'"></div>') if (iebrowser&&dom||dom) this.startit() else{ this.curimageindex++ setInterval("fadearray["+this.slideshowid+"].rotateimage()", this.delay) } } function fadepic(obj){ if (obj.degree<100){ obj.degree+=10 if (obj.tempobj.filters&&obj.tempobj.filters[0]){ if (typeof obj.tempobj.filters[0].opacity=="number") obj.tempobj.filters[0].opacity=obj.degree else //else if IE5.5- obj.tempobj.style.filter="alpha(opacity="+obj.degree+")" } else if (obj.tempobj.style.MozOpacity) obj.tempobj.style.MozOpacity=obj.degree/101 else if (obj.tempobj.style.KhtmlOpacity) obj.tempobj.style.KhtmlOpacity=obj.degree/100 else if (obj.tempobj.style.opacity&&!obj.tempobj.filters) obj.tempobj.style.opacity=obj.degree/101 } else{ clearInterval(fadeclear[obj.slideshowid]) obj.nextcanvas=(obj.curcanvas==obj.canvasbase+"_0")? obj.canvasbase+"_0" : obj.canvasbase+"_1" obj.tempobj=iebrowser? iebrowser[obj.nextcanvas] : document.getElementById(obj.nextcanvas) obj.populateslide(obj.tempobj, obj.nextimageindex) obj.nextimageindex=(obj.nextimageindex<obj.postimages.length-1)? obj.nextimageindex+1 : 0 setTimeout("fadearray["+obj.slideshowid+"].rotateimage()", obj.delay) } } fadeshow.prototype.populateslide=function(picobj, picindex){ var slideHTML="" if (this.theimages[picindex][1]!="") //if associated link exists for image slideHTML='<a href="'+this.theimages[picindex][1]+'" target="'+this.theimages[picindex][2]+'">' slideHTML+='<img src="'+this.postimages[picindex].src+'" border="'+this.imageborder+'px">' if (this.theimages[picindex][1]!="") //if associated link exists for image slideHTML+='</a>' picobj.innerHTML=slideHTML } fadeshow.prototype.rotateimage=function(){ if (this.pausecheck==1) //if pause onMouseover enabled, cache object var cacheobj=this if (this.mouseovercheck==1) setTimeout(function(){cacheobj.rotateimage()}, 100) else if (iebrowser&&dom||dom){ this.resetit() var crossobj=this.tempobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas) crossobj.style.zIndex++ fadeclear[this.slideshowid]=setInterval("fadepic(fadearray["+this.slideshowid+"])",50) this.curcanvas=(this.curcanvas==this.canvasbase+"_0")? this.canvasbase+"_1" : this.canvasbase+"_0" } else{ var ns4imgobj=document.images['defaultslide'+this.slideshowid] ns4imgobj.src=this.postimages[this.curimageindex].src } this.curimageindex=(this.curimageindex<this.postimages.length-1)? this.curimageindex+1 : 0 } fadeshow.prototype.resetit=function(){ this.degree=10 var crossobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas) if (crossobj.filters&&crossobj.filters[0]){ if (typeof crossobj.filters[0].opacity=="number") //if IE6+ crossobj.filters(0).opacity=this.degree else //else if IE5.5- crossobj.style.filter="alpha(opacity="+this.degree+")" } else if (crossobj.style.MozOpacity) crossobj.style.MozOpacity=this.degree/101 else if (crossobj.style.KhtmlOpacity) crossobj.style.KhtmlOpacity=this.degree/100 else if (crossobj.style.opacity&&!crossobj.filters) crossobj.style.opacity=this.degree/101 } fadeshow.prototype.startit=function(){ var crossobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas) this.populateslide(crossobj, this.curimageindex) if (this.pausecheck==1){ //IF SLIDESHOW SHOULD PAUSE ONMOUSEOVER var cacheobj=this var crossobjcontainer=iebrowser? iebrowser["master"+this.slideshowid] : document.getElementById("master"+this.slideshowid) crossobjcontainer.onmouseover=function(){cacheobj.mouseovercheck=1} crossobjcontainer.onmouseout=function(){cacheobj.mouseovercheck=0} } this.rotateimage() } </script> Similar TutorialsUPDATE: See next post. I'm having a problem with IE treating empty space in a DIV as solid, preventing me from clicking anything underneath it. The problem is demonstrated he http://tmabb.com/comicpress/ You can see it best if you look at the logo in the upper-left, though it also occurs farther down the page. The entirety of that logo should be clickable, but a portion of the bottom of it is not. Basically, you've got the top header and leaderboard in one DIV, and then below that, the comic pane is in another DIV. The comic DIV has a negative top margin to make it interlock with the leaderboard DIV, which is what is causing the issue. The upper-left of the comic DIV *should* be empty space, and in FF, Opera, and Safari, you can indeed click all of the upper-left logo as you would expect. In IE, however, that empty space which overlaps part of the logo makes that portion of the logo unclickable. I can't simply give the leaderboard DIV a higher z-index, because then its empty space will block the links in the upper-right of the comic pane DIV. Is there any way to make this work in IE? Hi, I'm new to HTML, i pretty much learned it by myself with online tutorials. Now i'm having problems with this web layout, There are empty spaces between cells and I can't remove them no matter what I do. I used cellpadding="0" and cellspacing="0" and style="border-collapse: collapse" but it made no difference. This is only happening on FireFox. On Internet Explorer it appears fine. I'm sure that I'm doing some stupid mistake somewhere. Here's the code of the whole page: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Using CSS</title> <style> body { margin:0; } </style> </head> <body topmargin="0" leftmargin="0" bottommargin="0"> <table cellpadding="0" border="1" style="border-collapse: collapse" cellspacing="0" height = "100%"> <tr> <td><img src="images/Gray-Cut-(layout)_01.gif" height="64"></td> <td><img src="images/Gray-Cut-(layout)_02.gif" height="64"></td> </tr> <tr> <TD class="example" width="786" colSpan="2" heigh="100%"> <TABLE id="Table2" height="100%" cellSpacing="0" cellPadding="0" border="1" style="border-collapse: collapse"> <TR> <TD><IMG height="21" alt="" src="images\Gray-Cut-(layout)_03.gif" width="182"></TD> <TD width="100%" rowSpan="5"><iframe name="iframe" src="home.html" height = "100%" width="100%" frameborder="0"></iframe></TD> </TR> <TR> <TD><IMG height="24" alt="" src="images\Gray-Cut-(layout)_05.gif" width="182"></TD> </TR> <TR> <TD><IMG height="24" alt="" src="images\Gray-Cut-(layout)_06.gif" width="182"></TD> </TR> <TR> <TD><IMG height="35" alt="" src="images\Gray-Cut-(layout)_07.gif" width="182"></TD> </TR> <TR> <TD height="100%"> </TD> </TR> </TABLE> </TD> </tr> </table> </body> </html> I have the site in center but there isn't any [center] tags. Surrounding it is empty black. How do I reduce the emptiness to make the site "bigger"? I'm in a bit of a fix here regarding editing the html of a blogger page. http://bweissnews.blogspot.com/ The problem is the empty space between the end of the last post and the bottom of the window. The gap is too large and doesn't mesh well with pages with fewer posts. Anything I'm missing anything regarding that? Thanks so much in advance. Hey guys, i have a div setup to overflow:auto; to scroll through comments on the site. It works correctly in Chrome, Internet Explorer, and Safari, but Firefox is showing a bunch of empty space thats equivalent to the height of the page if the div was displayed without a scroll. http://www.greendayauthority.com/ind...20798&archive= Take a look at that page on different browsers. It ends correctly with the ads being at the end in other browsers, but with firefox, there's a bunch of dead space stretching the pages height. Any advice? Hey guys, EDIT: I figured it out. There was a phantom image that I had between the two that no longer belongs. Nevermind! Thanks, ~C-Style~ i almost went crazy trying to troubleshoot this one... thought i'd share. HTML Code: <style type=text/css> a:link {font-family:Arial, Helvetica, sans-serif; font-size:12px;} </style> <table width="200" border="0" cellspacing="0" cellpadding="0"><tr> <td width="100" valign="top"> <a href="link">Sample text </a> <td width="100" valign="top"> <a href="link">Sample text</a> </td></tr></table> Turns out a "space" at the end of the link text pushes the text upwards slightly. Simply remove the space (or add on to the other line) or use the space code [ ] The css also plays a part, this doesn't appear happen when text is "unformatted" Hi, I have created an empty cell on top of the navigation menu, so that spiders check the main content first. Now that empty cell is quite different in IE or in Firefox. It moves my navigation up or down. This is the URL: http://www.papershreddersreviews.com...shredders.html Any solution to this problem? Thank, any ideas much appreciated. Hope I put this in the right section. The website I'm creating has a shopping cart. Respectivley there's a "view cart" button in the menu bar. But when I put the button in the menu, a blank space appears underneath the table like it's a break line. I viewed the page without the button and everything's perfect, so I'm pretty sure it's the form. I've tried putting the form itself into a table will zero-value margins, but it didn't seem to do anything. Is there anyway to get rid of the blank spot? I'm probably missing something. The program I'm using is Dreamweaver. =P Code: <table id="Table_01" width="800" height="48" border="0" cellpadding="0" cellspacing="0"> <tr> <td><a href="ciol_website/rosaries.html"><img src="ciol_website/slice/ciol_tab_01.gif" alt="" name="image1" width="160" height="24" border="0" id="image1" onmouseover="MM_showMenu(window.mm_menu_0825155153_0,0,24,null,'image1')" onmouseout="MM_startTimeout();" /></a></td> <td><a href="ciol_website/unique_items.html"><img src="ciol_website/slice/ciol_tab_02.gif" alt="" name="image2" width="160" height="24" border="0" id="image2" onmouseover="MM_showMenu(window.mm_menu_0825155740_0,0,24,null,'image2')" onmouseout="MM_startTimeout();" /></a></td> <td><a href="ciol_website/spec_occas.html"><img src="ciol_website/slice/ciol_tab_03.gif" alt="" name="image3" width="160" height="24" border="0" id="image3" onmouseover="MM_showMenu(window.mm_menu_0825160111_0,0,24,null,'image3')" onmouseout="MM_startTimeout();" /></a></td> <td><a href="ciol_website/just_for_kids.html"><img src="ciol_website/slice/ciol_tab_04.gif" alt="" name="image4" width="160" height="24" border="0" id="image4" onmouseover="MM_showMenu(window.mm_menu_0825160607_0,0,24,null,'image4')" onmouseout="MM_startTimeout();" /></a></td> <td><a href="ciol_website/aboutus.html"><img src="ciol_website/slice/ciol_tab_05.gif" alt="" name="image5" width="160" height="24" border="0" id="image5" onmouseover="MM_showMenu(window.mm_menu_0825160731_0,0,24,null,'image5')" onmouseout="MM_startTimeout();" /></a></td> </tr> <tr> <td width="160" height="24" align="center" valign="top"><a href="ciol_website/media.html"><img src="ciol_website/slice/ciol_tab_06.gif" alt="" name="image6" width="160" height="24" border="0" id="image6" onmouseover="MM_showMenu(window.mm_menu_0825160842_0,0,24,null,'image6')" onmouseout="MM_startTimeout();" /></a></td> <td width="160" height="24" align="center" valign="top"><a href="ciol_website/accessories.html"><img src="ciol_website/slice/ciol_tab_07.gif" alt="" name="image7" width="160" height="24" border="0" id="image7" onmouseover="MM_showMenu(window.mm_menu_0825160954_0,0,24,null,'image7')" onmouseout="MM_startTimeout();" /></a></td> <td width="160" height="24" align="center" valign="top"><a href="ciol_website/catholicessentials.html"><img src="ciol_website/slice/ciol_tab_08.gif" alt="" name="image8" width="160" height="24" border="0" id="image8" onmouseover="MM_showMenu(window.mm_menu_0825161102_0,0,24,null,'image8')" onmouseout="MM_startTimeout();" /></a></td> <td width="160" height="24" align="center" valign="top"><a href="ciol_website/for_you.html"><img src="ciol_website/slice/ciol_tab_09.gif" alt="" width="160" height="24" border="0" /></a></td> <td width="160" height="24" align="center" valign="top"><form target="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post"> <input type="hidden" name="cmd" value="_cart" /> <input type="hidden" name="business" value="e@mail.com" /> <input type="hidden" name="display" value="1" /> <input type="image" src="http://catholicitemsonline.com/ciol_website/slice/ciol_tab_10.gif" border="0" name="submit" alt="View items in your cart." /> </form> </td> </tr> </table> Hi all, i am new here. I am also new to HTML. I have com accross a small problem with my first site, the problem is that i have added a few image tags within a <div> element and that when I positioned them using an external css style sheet that the images themselves move but the lines that they were originally on remain there. It is leaving a rather large white gap at the base of my website and is leaving me with fewer strands of hair on my already rather shiny head. Thanks in advance for any help that anyone can offer on this thread. John Hello all! I need some help to make a link on my webpage which can open a Youtube-video in a new empty window. Youtube.com offers to types of linking the video-code: a) a regular URL-link for opening the video in a regular youtube-page (with all menus and ads) Example: http://www.youtube.com/watch?v=_i_VvpQbYj4 b) an embed-code which will show the video anywhere you want on your webpage. Example: <object width="425" height="350"><param name="movie" value="http://www.youtube.com/v/_i_VvpQbYj4"></param><param name="wmode" value="transparent"></param><embed src="http://www.youtube.com/v/_i_VvpQbYj4" type="application/x-shockwave-flash" wmode="transparent" width="425" height="350"></embed></object> So I guess we have to combine these two methods for solving the problem? Perhaps I can make an empty html-page called "\videopage.html", and then make a link-code which opens the videopage.html showing the video embedded? Like this: 1. Make a file called "\videopage.html" 2. Make a link on my webpage with the unknown code. 3. When a user clicking on my video-link, it opens the page called "\videopage.html" and plays the video. 4. I have many videos linking from youtube, so I think I have to re-use the page called "\videopage.html" many times. 5. This means the "\videopage.html" needs to be empty all the time, and just be 'called on' by the code. Can anyone help me? I hope a clever HTML-coder can make this work... Anyone with ideas? Best regards, Stereoid Hello, My name is Eli and I cannot figure out why in the 2nd and 3rd rows of this HTML table there are empty spaces between the columns, making these rows go over the table width limitation of 770. I would really appreciate some help, as it is getting very frustrating and I am sure there is a very simple solution that I am missing. I've searched threads but could not find the right answer. Here is the table HTML code: <table border="0" align="left" cellspacing="0" cellpadding="0" width="770"> <tr> <td width="770" height="1" colspan="2" bgcolor="#FFFFFF"><img src="http://yst.sale-la-vie.com/images/spacer.gif" alt="spacer" width="4" height="1" border="0" align="middle" /></td> </tr> <tr> <td colspan="2" align="left" valign="top" bgcolor="0"><img src="http://yst.sale-la-vie.com/images/main-mid.jpg" alt="" border="0" /></a></td> <td align="left"><img src="http://yst.sale-la-vie.com/images/right-mid.jpg" alt="" border="0" /></a></td> </tr> <tr> <td align="left"><img src="http://yst.sale-la-vie.com/images/mid-necklaces-img.jpg" alt="" border="0" /></a></td> <td align="left"><img src="http://yst.sale-la-vie.com/images/mid-earringss-img.jpg" alt="" border="0" /></a></td> <td align="left"><img src="http://yst.sale-la-vie.com/images/mid-goodlook-img.jpg" alt="" border="0" /></a></td> </tr> <tr> <td align="left"><img src="http://yst.sale-la-vie.com/images/mid-bracelets-img.jpg" alt="" border="0" /></a></td> <td align="left"><img src="http://yst.sale-la-vie.com/images/mid-summer-img.jpg" alt="" border="0" /></a></td> <td align="left"><img src="http://yst.sale-la-vie.com/images/mid-newlook-img.jpg" alt="" border="0" /></a></td> </tr> </table> Thanks and best wishes, Eli Hey guys, Need a little help with... http://www.netsketched.com/NRG/ There is a space up top that I can't get rid of. Also, is there a way I can make the layout flow to the bottom regardless of the amount of content? Just moved the site to its new server and added the navigation... now suddenly I have some spacing at the top and I need another set of eyes. http://www.phinfever.com/newsite Note*: Spacing not visible on IE7... it is on Firefox3 Hi Experts, I am facing some problem in the row spaces. I am new to project and previous programmer used some tool to write HTML code. now I am not able to understand the HTML part of code. I don't know why but the first row table border is missing in this. Here is the code:- <table class=MsoNormalTable border=0 cellspacing=0 cellpadding=0 style='margin-left:25.0pt margin-bottom:25.0pt;border-collapse:collapse'>" + "<tr height=25 style='height:19.1pt'> <td width=551 colspan=2 height=25 valign=top style='width:413.2pt;border: none;border-bottom:solid windowtext 1.0pt;padding:0in 5.4pt 0in 5.4pt; height:19.1pt'> <p class=MsoNormal><font size=3 face="+ String.valueOf((char) (34)) +"Times New Roman"+ String.valueOf((char) (34)) +"><span style='font-size:12.0pt'>Hi " + Item[4] +",<o:p></o:p></span></font></p> <p class=MsoNormal><font size=3 face="+ String.valueOf((char) (34)) +"Times New Roman"+ String.valueOf((char) (34)) +"><span style='font-size:12.0pt'><o:p> </o:p></span></font></p> <p class=MsoNormal style='text-align:justify'><font size=3 face="+ String.valueOf((char) (34)) +"Times New Roman"+ String.valueOf((char) (34)) +"><span style='font-size:12.0pt'>It was a pleasure talking to you. Based on our discussions I have forwarded your resume to my Business Development Manager (see below) who will be either calling or emailing you very soon with other details.<o:p></o:p></span></font></p>" + "<br><p class=MsoNormal style='text-align:justify'><font size=3 face="+ String.valueOf((char) (34)) +"Times New Roman"+ String.valueOf((char) (34)) +"><span style='font-size:12.0pt'>The job description for this assignment is as follows:<o:p></o:p></span></font></p><p class=MsoNormal style='margin-left:3.45pt'><font size=2 f=Arial><span style='font-size:11.0pt;font-family:Arial'><o:p> </o:p></span></font></p></td> </tr>" + "<tr height=34 style='height:25.4pt'><td width=132 height=34 valign=top style='width:99.3pt;border:solid windowtext 1.0pt; border-top:none;padding:0in 5.4pt 0in 5.4pt;height:25.4pt'><p class=MsoNormal align=right style='text-align:right'><b><font size=2 color="+ String.valueOf((char) (34)) +"#3366ff"+ String.valueOf((char) (34)) +" face=Tahoma><span style='font-size:11.0pt;font-family:Tahoma; color:#3366FF;font-weight:bold'>Location:<o:p></o:p></span></font></b></p> <p class=MsoNormal><font size=2 face=Arial><span style='font-size:10.0pt; font-family:Arial'><o:p> </o:p></span></font></p></td><td width=619 height=34 valign=top style='width:313.9pt;border-top:none; border-left:none;border-bottom:solid windowtext 1.0pt;border-right:solid windowtext 1.0pt; padding:0in 5.4pt 0in 5.4pt;height:25.4pt'><p class=MsoNormal><font size=3 face="+ String.valueOf((char) (34)) +"Times New Roman"+ String.valueOf((char) (34)) +"><span style='font-size:12.0pt'>" +Location +"<o:p></o:p></span></font></p></td></tr>" + "<tr height=34 style='height:25.55pt'><td width=132 height=34 valign=top style='width:99.3pt;border:solid windowtext 1.0pt; border-top:none;padding:0in 5.4pt 0in 5.4pt;height:25.55pt'><p class=MsoNormal align=right style='text-align:right'><b><font size=2 color="+ String.valueOf((char) (34)) +"#3366ff"+ String.valueOf((char) (34)) +" face=Tahoma><span style='font-size:11.0pt;font-family:Tahoma; color:#3366FF;font-weight:bold'>Job description:<o:p></o:p></span></font></b></p><p class=MsoNormal align=right style='text-align:right'><font size=2 face=Arial><span style='font-size:10.0pt;font-family:Arial'><o:p> </o:p></span></font></p></td><td width=619 height=34 valign=top style='width:313.9pt;border-top:none; border-left:none;border-bottom:solid windowtext 1.0pt;border-right:solid windowtext 1.0pt; padding:0in 5.4pt 0in 5.4pt;height:25.55pt'> <p class=MsoNormal><font size=3 face="+ String.valueOf((char) (34)) +"Times New Roman"+ String.valueOf((char) (34)) +">" +DesC +"</p></td></tr>" + "<tr height=34 style='height:25.4pt'><td width=132 height=34 valign=top style='width:99.3pt;border:solid windowtext 1.0pt;border-top:none;padding:0in 5.4pt 0in 5.4pt;height:25.4pt'><p class=MsoNormal align=right style='text-align:right'><b><font size=2 color="+ String.valueOf((char) (34)) +"#3366ff"+ String.valueOf((char) (34)) +" face=Tahoma><span style='font-size:11.0pt;font-family:Tahoma; color:#3366FF;font-weight:bold'>Duration:<o:p></o:p></span></font></b></p><p class=MsoNormal><font size=2 face=Arial><span style='font-size:10.0pt; font-family:Arial'><o:p> </o:p></span></font></p></td><td width=619 height=34 valign=top style='width:313.9pt;border-top:none;border-left:none;border-bottom:solid windowtext 1.0pt;border-right:solid windowtext 1.0pt; padding:0in 5.4pt 0in 5.4pt;height:25.4pt'><p class=MsoNormal><font size=3 face="+ String.valueOf((char) (34)) +"Times New Roman"+ String.valueOf((char) (34)) +"><span style='font-size:12.0pt'>" +Duration +"<o:p></o:p></span></font></p></td></tr>" + "<tr height=34 style='height:25.4pt'><td width=132 height=34 valign=top style='width:99.3pt;border:solid windowtext 1.0pt;border-top:none;padding:0in 5.4pt 0in 5.4pt;height:25.4pt'><p class=MsoNormal align=right style='text-align:right'><b><font size=2 color="+ String.valueOf((char) (34)) +"#3366ff"+ String.valueOf((char) (34)) +" face=Tahoma><span style='font-size:11.0pt;font-family:Tahoma;color:#3366FF;font-weight:bold'>Details:<o:p></o:p></span></font></b></p><p class=MsoNormal><font size=2 face=Arial><span style='font-size:10.0pt;font-family:Arial'><o:p> </o:p></span></font></p></td>" + "<td width=619 height=34 valign=top style='width:313.9pt;border-top:none;border-left:none;border-bottom:solid windowtext 1.0pt;border-right:solid windowtext 1.0pt; padding:0in 5.4pt 0in 5.4pt;height:25.4pt'><p class=MsoNormal><font size=3 face="+ String.valueOf((char) (34)) +"Times New Roman"+ String.valueOf((char) (34)) +"><span style='font-size:12.0pt'>TBD</span></font></p></td></tr>" + "<tr height=34 style='height:25.4pt'><td width=132 height=34 valign=top style='width:99.3pt;border:solid windowtext 1.0pt; border-top:none;padding:0in 5.4pt 0in 5.4pt;height:25.4pt'><p class=MsoNormal align=right style='text-align:right'><b><font size=2 color="+ String.valueOf((char) (34)) +"#3366ff"+ String.valueOf((char) (34)) +" face=Tahoma><span style='font-size:11.0pt;font-family:Tahoma; color:#3366FF;font-weight:bold'>BDM / Marketing Manager<o:p></o:p></span></font></b></p></td><td width=619 height=34 valign=top style='width:313.9pt;border-top:none; border-left:none;border-bottom:solid windowtext 1.0pt;border-right:solid windowtext 1.0pt; padding:0in 5.4pt 0in 5.4pt;height:25.4pt'><p class=MsoNormal><font size=3 face="+ String.valueOf((char) (34)) +"Times New Roman"+ String.valueOf((char) (34)) +"><span style='font-size:12.0pt'>" + StaffName + " " + basUtilities.DLookup("EXT" , "EmailContact", "FirstName='" + basUtilities.UserID() + "'") + "<o:p></o:p></span></font></p> </td></tr>" +NewColumSkill +"</table>" + Please help me to fix this. This isn't merely an attempt to sound like something from "The Matrix", but I'm continuing to work on my companies website and for some reason in IE when I place a picture at a certain place the web page give me enough room to scroll the page right. (There isn't anything there, it just has a scroll bar at the bottom and you can scroll the whole thing right leaving it half off the page looking at just background.) Link: http://802heaven.analogcafe.net/TTCBeta/mainstage.html If someone could take a look at that and tell me some ideas for how to fix it that would be GRRRR8. Thanks. First post here, I know a little bit so hopefully there will some n00ber than I to help down the road. For some reason all of these attempts (in html5) are coming up with 4px between the top and bottom of the images (horizontal space) Code: <table width="664" border="0" cellspacing="0" cellpadding="0"> <tr> <td><img src="images/1.jpg" width="664" height="131" hspace="0" vspace="0"></td> </tr> <tr> <td><img src="images/2.jpg" width="131" height="19" hspace="0" vspace="0"><img src="images/3.jpg" width="87" height="19" hspace="0" vspace="0"><img src="images/4.jpg" width="446" height="19" hspace="0" vspace="0"></td> </tr> <tr> <td><img src="images/5.jpg" width="664" height="381" hspace="0" vspace="0"></td> </tr> <tr> <td><img src="images/6.jpg" width="330" height="28" hspace="0" vspace="0"><img src="images/7.jpg" width="96" height="28" hspace="0" vspace="0"><img src="images/8.jpg" width="106" height="28" hspace="0" vspace="0"><img src="images/9.jpg" width="132" height="28" hspace="0" vspace="0"></td> </tr> <tr> <td><img src="images/10.jpg" width="664" height="130" hspace="0" vspace="0"></td> </tr> </table> I also tried it previously without the hspace/vspace attributes with no success. I also tried it just like this. Code: <img src="images/1.jpg" width="664" height="131" hspace="0" vspace="0"><img src="images/2.jpg" width="131" height="19" hspace="0" vspace="0"><img src="images/3.jpg" width="87" height="19" hspace="0" vspace="0"><img src="images/4.jpg" width="446" height="19" hspace="0" vspace="0"> <img src="images/5.jpg" width="664" height="381" hspace="0" vspace="0"> <img src="images/6.jpg" width="330" height="28" hspace="0" vspace="0"><img src="images/7.jpg" width="96" height="28" hspace="0" vspace="0"><img src="images/8.jpg" width="106" height="28" hspace="0" vspace="0"><img src="images/9.jpg" width="132" height="28" hspace="0" vspace="0"> <img src="images/10.jpg" width="664" height="130" hspace="0" vspace="0"> Here's the whole site if it helps Code: <!DOCTYPE html> <head> <title>Ayla Stapleton</title> <meta charset="utf-8" /> <meta name="description" content="Ayla Stapleton is an Australian born model working out of Sydney" /> <meta name="keywords" content="Ayla, Stapleton, Ayla Stapleton, model, modelling, Sydney, Australia, female model" /> <!-- lightbox includes --> <script type="text/javascript" src="js/prototype.js"></script> <script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script> <script type="text/javascript" src="js/lightbox.js"></script> <link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" /> <style type="text/css"> <!-- body { font: 80% Verdana, Arial, Helvetica, sans-serif; background: #0b0010; margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */ padding: 0; text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */ color: #ffffff; } .oneColFixCtr #container { width: 664px; background: #0b0010; margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */ text-align: left; /* this overrides the text-align: center on the body element. */ } .oneColFixCtr #mainContent { padding: 0px; /* remember that padding is the space inside the div box and margin is the space outside the div box */ } --> </style> </head> <body class="oneColFixCtr"> <div id="container"> <div id="mainContent"> <table width="664" border="0" cellspacing="0" cellpadding="0"> <tr> <td><img src="images/1.jpg" width="664" height="131" hspace="0" vspace="0"></td> </tr> <tr> <td><img src="images/2.jpg" width="131" height="19" hspace="0" vspace="0"><img src="images/3.jpg" width="87" height="19" hspace="0" vspace="0"><img src="images/4.jpg" width="446" height="19" hspace="0" vspace="0"></td> </tr> <tr> <td><img src="images/5.jpg" width="664" height="381" hspace="0" vspace="0"></td> </tr> <tr> <td><img src="images/6.jpg" width="330" height="28" hspace="0" vspace="0"><img src="images/7.jpg" width="96" height="28" hspace="0" vspace="0"><img src="images/8.jpg" width="106" height="28" hspace="0" vspace="0"><img src="images/9.jpg" width="132" height="28" hspace="0" vspace="0"></td> </tr> <tr> <td><img src="images/10.jpg" width="664" height="130"></td> </tr> </table> <a href="images/1.jpg" rel="lightbox[roadtrip]" title="Gallery"><img src="images/ayla_stapleton.jpg" alt="Ayla Stapleton" width="664" height="689" border="0" usemap="#Map"></a> <map name="Map"> <area shape="rect" coords="132,132,218,149" href="" alt="Gallery"> <area shape="rect" coords="132,149,218,165" href="" alt="Info"> <area shape="rect" coords="330,532,425,558" href="www.facebook.com/ayla.fanpage" alt="Facebook"> <area shape="rect" coords="426,532,532,558" href="http://www.twitter.com/aylastapleton" alt="Twitter"> </map> <a href="images/2.jpg" rel="lightbox[roadtrip]"></a> <a href="images/3.jpg" rel="lightbox[roadtrip]"></a> <h2>About Ayla Stapleton</h2> <p>Ayla is an Australian-born, freelance model slowly emerging into the acting, film & tv industry. She has been modelling from a very young age - completing her first professional modelling course when just ten years old. She completed year 12 at a small catholic college in 2007 achieving a scholarship for her university studies. Ayla has studied a dual degree Bachelor of Business/Bachelor of Professional Communication (specialising in Marketing). She has also studied acting at ACTT (Actors College of Theatre & Television) in Sydney. Ayla is a full-time professional model - meaning she is reliable & skillful - because her modelling is her business; not just a weekend hobby. She has maintained a positive image and reputation.</p> <p>You can be sure to have a positive experience when working with Ayla. She is available for almost all types of modelling, particularly in swimwear and lingerie. Full and half day rates available upon request. Available for work internationally.</p> <h2>Stats</h2> <ul><li>Height: 5'11</li> <li>Weight: 63kg</li> <li>Measurements: 37-24-33</li> <li>Dress size: 8</li> <li>Cup size: 10F</li> <li>Shoe size: 10</li> <li>Hair: Brown</li> <li>Eyes: Brown</li> <li>Skin: Tanned</li> <li>D.O.B: 24.07.1990</li> <li>No tattoos, piercings, or markings.</li> </ul> <h2>Consider Ayla for</h2> <ul> <li>Swimwear/Bikini Promotions</li> <li>Fashion Parades</li> <li>Magazine Appearances</li> <li>Film/TV</li> <li>Video Clips</li> <li>Catwalk Modeling</li> <li>Sporting Events</li> <li>Corporate Event Waitressing/Hostessing</li> <li>Card Girl for Boxing, Muai Thai, Kickboxing etc.</li> <li>Music Festivals</li> <li>Fundraising Events</li> <li>Product Launches</li> <li>Race Day Promotions</li> <li>VIP Waitressing</li> </ul> <!-- Do not change code! --> <table cellspacing="0" cellpadding="0" border="0" align="center"><tr><td><iframe width="400" height="440" frameborder="0" src="http://www.foxyform.com/form.php?id=130068&sec_hash=614236b4643"></iframe></td></tr><tr><td align="center"><a style="font:8px Arial;color:#5C5C5C;" href="http://www.foxyform.com">foxyform.com</a></td></tr></table> <!-- Do not change code! --> <!-- end #mainContent --></div> <!-- end #container --></div> </body> </html> Hello, Im making my navigation bar with a mouse over effect on the buttons. however im getting "extra space" under the command. A blank page can be seen at saracrew.org/blank.html Any help is greatly appricated, Thanks! <!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>SARAcrew.org</title> <link rel="stylesheet" type="text/css" href="general.css" /> </head> <body bgcolor="505769" leftmargin=0 topmargin=0> <table border="0" cellspacing="0" cellpadding="0" bgcolor="505769"> <tr><td colspan="4"> <table border=0 cellpadding=0 cellspacing=0> <tr> <td colspan="4"><img src= "images/banner1.jpg" alt="banner" /></td> </tr> <tr> <td><table border=0 cellpadding=0 cellspacing=0> <td><img src= "images/left_vbar_nav.gif" alt="vbar" /></td> <td> <table border=0 cellpadding=0 cellspacing=0> <tr><td><img src= "images/nav_bar_1.gif" /></td></tr> <tr><td><a href=home.html><img src="images/home_off.gif" onmouseover="this.src='images/home_on.gif'" onmouseout="this.src='images/home_off.gif'" border=0 /></a> </td></tr> <tr><td><img src= "images/nav_bar_2.gif" /></td></tr> <tr><td><a href=news.html><img src="images/news_off.gif" onmouseover="this.src='images/news_on.gif'" onmouseout="this.src='images/news_off.gif'" border=0 /></a> </td></tr> <tr><td><img src= "images/nav_bar_3.gif" /></td></tr> <tr><td><a href=results.html><img src="images/results_off.gif" onmouseover="this.src='images/results_on.gif'" onmouseout="this.src='images/results_off.gif'" border=0 /></a> </td></tr> <tr><td><img src= "images/nav_bar_4.gif" /></td></tr> <tr><td><a href=board.html><img src="images/board_off.gif" onmouseover="this.src='images/board_on.gif'" onmouseout="this.src='images/board_off.gif'" border=0 /></a> </td></tr> <tr><td><img src= "images/nav_bar_5.gif" /></td></tr> <tr><td><a href=pictures.html><img src="images/pictures_off.gif" onmouseover="this.src='images/pictures_on.gif'" onmouseout="this.src='images/pictures_off.gif'" border=0 /></a> </td></tr> <tr><td><img src= "images/nav_bar_6.gif" /></td></tr> <tr><td><a href=orange_oar.html><img src="images/orange_oar_off.gif" onmouseover="this.src='images/orange_oar_on.gif'" onmouseout="this.src='images/orange_oar_off.gif'" border=0 /></a> </td></tr> <tr><td><img src= "images/nav_bar_7.gif" /></td></tr> <tr><td><a href=dues.html><img src="images/dues_off.gif" onmouseover="this.src='images/dues_on.gif'" onmouseout="this.src='images/dues_off.gif'" border=0 /></a> </td></tr> <tr><td><img src= "images/nav_bar_8.gif" /></td></tr> <tr><td><a href=info.html><img src="images/info_off.gif" onmouseover="this.src='images/info_on.gif'" onmouseout="this.src='images/info_off.gif'" border=0 /></a> </td></tr> <tr><td><img src= "images/nav_bar_9.gif" /></td></tr> <tr><td><a href=email.html><img src="images/email_off.gif" onmouseover="this.src='images/email_on.gif'" onmouseout="this.src='images/email_off.gif'" border=0 /></a> </td></tr> <tr><td><img src= "images/nav_bar_10.gif" /></td></tr> </table> </td> <td><img src= "images/right_vbar_nav.gif" alt="vbar" /></td> </table></td></tr> </table> </td> </tr> </table> </td></tr> </table> </body> </html> Hi! I've looked it over and over ant I can't seem to find the solution to this. A huge space appears on my webpage without permission! Here is the code HTML Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <SCRIPT TYPE="text/javascript"> function popup(mylink, annonces) { if (! window.focus)return true; var href; if (typeof(mylink) == 'string') href=mylink; else href=mylink.href; window.open(href, annonces, 'width=600,height=600,scrollbars=yes'); return false; } // </SCRIPT> <TITLE>Duo: balalaika et piano -- Dmitri Nassyrov et Victoria Khramova</TITLE> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; Charset=Windows-1251"> <META NAME="GENERATOR" CONTENT="Microsoft FrontPage 5.0"> <META NAME="Author" CONTENT="Dmitri Nassyrov"> <META NAME="KeyWords" CONTENT="balalaika, Victoria, Khramova, Dmitri, Nassyrov, concerts, piano, duo, stringsandkeys, douce, soiree, histoire, du, balalaika"> <META NAME="Description" CONTENT="Le duo du balalaïka et du piano: Dmitri Nassyrov et Victoria Khramova, ont un repertoire tres varié: folklorique, classique, jazz, et autres... "> <TITLE>Duo:balalaïka et piano - Dmitri Nassyrov et Victoria Khramova</TITLE> <link rel="stylesheet" type="text/css" href="style.css" /> </HEAD> <div id="container"> <BODY BGCOLOR="#000000" TEXT="#000000" LINK="#0000FF" VLINK="#7F007F" ALINK="#FF0000" BACKGROUND="../img/bcknd.jpg" bgproperties="fixed"> <script language="javascript"> var u=13200; var vsbl=0; var l=''; </script> <script type="text/javascript" language=Javascript src="http://h1.hitslog.com/counter.js"></script> <script language="javascript"> document.write('<a href=http://hitslog.com/><img border=0 width=1 height=1 src=http://h1.hitslog.com/hl.php?'+l+'></a>'); </script> <noscript> <a href="http://hitslog.com/"><img border=0 width=1 height=1 src="http://h1.hitslog.com/hl.php?u=13200" alt="MySpace tracker"></a></noscript> <TABLE id="main"> <tR width=720 height=160> <td valign=top width=615 height=160><IMG width=615 height=160 alt="Duo: balalaïka et piano - Dmitri Nassyrov et Victoria Khramova" SRC="../site/IMG/HEADER2.gif"> </td> <td> <table valign=center width=105 height=75 cellpadding=0> <tr class="lang"> <img alt="En Français" border=0 src="../site/img/francaisclik.gif" > </tr> <tr class="lang"> <a href="../eng/index.html"><img alt="In English" onmouseover="this.src='../site/img/englishon.gif'" onmouseout="this.src='../site/img/english.gif'" onclick="this.src='../site/img/englishclik.gif'" border=0 src="../site/img/english.gif"></a> </tr> <tr class="lang"> <a href="../rus/index.html"><img alt="По-Русски" onmouseover="this.src='../site/img/russianon.gif'" onmouseout="this.src='../site/img/russian.gif'" onclick="this.src='../site/img/russianclik.gif'" border=0 src="../site/img/russian.gif"></a> </tr> <tr width=100 height=85> <img alt="Duo: balalaïka et piano - Dmitri Nassyrov et Victoria Khramova" src="../site/img/sideheader.gif"> </tr> </table> </td> </tR> <!--The big space is here--> <TR> <td colspan=2> <table width=720> <tr> <td valign=top> <TABLE valign=top> <TR> <TD class="menu"><A HREF="INDEX.HTML"><img src="../img/bienvenueclik.gif" alt="Bienvenue" border="0"></a></TD> </TR> <TR> <TD class="menu"><A HREF="DUO.HTML"><img src="../img/leduo.gif" alt="Notre duo" onmouseover="this.src='../img/leduoon.gif'" onmouseout="this.src='../img/leduo.gif'" onclick="this.src='../img/leduoclik.gif'" border="0"></A></TD> </TR> <TR> <TD class="menu"><A HREF="concerts.HTML"><img src="../img/concerts.gif" alt="Nos concerts" onmouseover="this.src='../img/concertson.gif'" onmouseout="this.src='../img/concerts.gif'" onclick="this.src='../img/concertsclik.gif'" border="0"></A></TD> </TR> <TR> <TD class="menu"><A HREF="audio.HTML"><img src="../img/audio.gif" alt="Notre musique" onmouseover="this.src='../img/audioon.gif'" onmouseout="this.src='../img/audio.gif'" onclick="this.src='../img/audioclik.gif'"border="0"></A></TD> </TR> <TR> <TD class="menu"><A HREF="historique.HTML"><img src="../img/historique.gif" alt="L'Histoire du balalaïka" onmouseover="this.src='../img/historiqueon.gif'" onmouseout="this.src='../img/historique.gif'" onclick="this.src='../img/historiqueclik.gif'" border="0"></A></TD> </TR> <TR> <TD class="menu"><A HREF="liens.HTML"><img src="../img/liens.gif" alt="Liens" onmouseover="this.src='../img/lienson.gif'" onmouseout="this.src='../img/liens.gif'" onclick="this.src='../img/liensclik.gif'" border="0"></A></TD> </TR> <TR> <TD class="menu"><A HREF="contact.HTML"><img src="../img/contact.gif" alt="Comment nous rejoindre" onmouseover="this.src='../img/contacton.gif'" onmouseout="this.src='../img/contact.gif'" onclick="this.src='../img/contactclik.gif'" border="0"></A></TD> </TR> </TABLE> </tD> <TD VALIGN=top> <table id="text" height=100% width=500 cellpadding=20 style="BACKGROUND: url('../site/img/textbcknd.jpg'); "> <tr> <!--<marquee id="test" onMouseOver="document.all.test.stop()" onMouseOut="document.all.test.start()" scrollamount="2" scrolldelay="20" width="100%" height="51" behavior="scroll" direction="left"><font face="arial" align=middle><i> <A HREF="annonces3.html" onClick="return popup(this, 'annonces',true)"><b>17 novembre - 20:00</b></A><br> Festival "From Russia With Love"<br> à la bibliothèque publique juive. </i></font></marquee>--> </tr> <tr> <td valign=top> <font face="times new roman" size=3> <h2>Un duo, c'est indivisible...</h2> <p align=justify>Dans un duo, le rôle de chaque musicien n'est pas seulement de compléter son partenaire, mais aussi de souligner la sonorité de son instrument.</p> <p align=justify>Notre duo est assez particulier et assez unique à Montréal. Les deux instruments composant notre duo sont: le piano et le balalaïka - instrument folklorique russe. Les possibilitées de cette union sont surprenantes, dans le répertoi folklore, classique, jazz...</p> <hr width=95%></hr> <p>Sur ce site, vous trouverez de l'information sur nos <A HREF="concerts.HTML">concerts</A>, vous pourrez écouter nos <A HREF="audio.HTML">enregistrements</A>, lire nos <A HREF="DUO.HTML">biographies</A>, et plus encore.</p> <p>Et, bien sûr, nous serons heureux de vous voir à nos concerts!</P> <p><i>Dmitri Nassyrov et Victoria Khramova</i></p> </TD> </tr> </table> </td> </tr> </table> </td> </TR> </TABLE> <font face="arial" size=1 align=right> &nb sp; &nb sp; &nb sp; Dmitri Nassyrov et Victoria Khramova © Tous droits réservés.</font> </BODY> </div> </HTML> I put "The big space is here" where the space occurs. The weird thing is that if I open the file in some html editing software (frontpage), it looks fine, but once I open it in IE, the space appears. Here is the style.css file if it needs checking: HTML Code: body { text-align: center; background-color: rgb(239,197,137); } #container { margin: 0 auto; } #main { border:0px; /* border="0" */ border-collapse:collapse; /* cellspacing="0" */ } #top { border:0px; /* border="0" */ border-collapse:collapse; /* cellspacing="0" */ } tr.lang { horizontal-align:left; width:100px; height:25px; } td.menu { width:220; height:40; } table { border-collapse:collapse; } #text { padding:20px; } Any help is appreciated. Thank you for your time! |