473,769 Members | 1,723 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Using ASP.NET 2.0's ImageMap Control

I am using ASP.NET 2.0's ImageMap Control to create 2 imagemaps, one
directly below the other. When I do this a thin blank space appears between
them. After several days of frustration I realized that the difference
between what the ImageMap Control outputs and the html on the page I was
trying to reproduce with ASP.NET 2.0 was the following:
Handwritten HTML imagemaps (no whitestrip between them):

<table>
<tr>
<td>
<img/><br/>
<map>
<area/>
</map>
<img/><br/>
<map>
<area/>
</map>
</td>
</tr>
</table>

ASP.NET 2.0 generated HTML using the ImageMap Control (whitestrip appears
between the two ImageMaps):

<table>
<tr>
<td>
<img/>
<map>
<area/>
</map>
<img/>
<map>
<area/>
</map>
</td>
</tr>
</table>
In case you didn't see it, the difference is that the handwritten HTML
includes a <br/between the <img/and <maptags. However, this is not
achievable (at least not using any technique I can think of) using the
ASP.NET 2.0 ImageMap Control. What can I do? Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/
Sep 24 '06 #1
9 2115
Put each control into a separate Panel or div and use styled margins to
manage white space.

<%= Clinton Gallagher
NET csgallagher AT metromilwaukee. com
URL http://clintongallagher.metromilwaukee.com/
MAP 43°2'17"N 88°2'37"W : 43°2'17"N 88°2'37"W

"Nathan Sokalski" <nj********@hot mail.comwrote in message
news:OZ******** ******@TK2MSFTN GP04.phx.gbl...
>I am using ASP.NET 2.0's ImageMap Control to create 2 imagemaps, one
directly below the other. When I do this a thin blank space appears between
them. After several days of frustration I realized that the difference
between what the ImageMap Control outputs and the html on the page I was
trying to reproduce with ASP.NET 2.0 was the following:
Handwritten HTML imagemaps (no whitestrip between them):

<table>
<tr>
<td>
<img/><br/>
<map>
<area/>
</map>
<img/><br/>
<map>
<area/>
</map>
</td>
</tr>
</table>

ASP.NET 2.0 generated HTML using the ImageMap Control (whitestrip appears
between the two ImageMaps):

<table>
<tr>
<td>
<img/>
<map>
<area/>
</map>
<img/>
<map>
<area/>
</map>
</td>
</tr>
</table>
In case you didn't see it, the difference is that the handwritten HTML
includes a <br/between the <img/and <maptags. However, this is not
achievable (at least not using any technique I can think of) using the
ASP.NET 2.0 ImageMap Control. What can I do? Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/

Sep 24 '06 #2
I have tried using CSS properties to control this, but it does not seem to
help. Here is my actual code (I removed the <asp:RectangleH otSpot/tags to
shorten it):

<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center" style="margin:0 px;padding:0px; ">
<asp:ImageMap ID="mapBanner" runat="server"
BorderWidth="0p x" Height="82px" ImageUrl="../images/top_banner.jpg"
Width="1000px" style="margin:0 px;padding:0px; ">
</asp:ImageMap>
<asp:ImageMap ID="mapNavBanne r" runat="server"
Width="1000" Height="19" BorderWidth="0" ImageUrl="../images/navigation.jpg"
style="margin:0 px;padding:0px; ">
</asp:ImageMap>
</td>
</tr>
</table>

I have also tried using two separate table rows, which did not help either.
Any other ideas? Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/

"clintonG" <cs*********@RE MOVETHISTEXTmet romilwaukee.com wrote in message
news:%2******** ********@TK2MSF TNGP03.phx.gbl. ..
Put each control into a separate Panel or div and use styled margins to
manage white space.

<%= Clinton Gallagher
NET csgallagher AT metromilwaukee. com
URL http://clintongallagher.metromilwaukee.com/
MAP 43°2'17"N 88°2'37"W : 43°2'17"N 88°2'37"W

"Nathan Sokalski" <nj********@hot mail.comwrote in message
news:OZ******** ******@TK2MSFTN GP04.phx.gbl...
>>I am using ASP.NET 2.0's ImageMap Control to create 2 imagemaps, one
directly below the other. When I do this a thin blank space appears
between them. After several days of frustration I realized that the
difference between what the ImageMap Control outputs and the html on the
page I was trying to reproduce with ASP.NET 2.0 was the following:
Handwritten HTML imagemaps (no whitestrip between them):

<table>
<tr>
<td>
<img/><br/>
<map>
<area/>
</map>
<img/><br/>
<map>
<area/>
</map>
</td>
</tr>
</table>

ASP.NET 2.0 generated HTML using the ImageMap Control (whitestrip appears
between the two ImageMaps):

<table>
<tr>
<td>
<img/>
<map>
<area/>
</map>
<img/>
<map>
<area/>
</map>
</td>
</tr>
</table>
In case you didn't see it, the difference is that the handwritten HTML
includes a <br/between the <img/and <maptags. However, this is not
achievable (at least not using any technique I can think of) using the
ASP.NET 2.0 ImageMap Control. What can I do? Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/


Sep 24 '06 #3
Try it the way I suggested. Get them out of the td and into divs of their
own.

<%= Clinton

"Nathan Sokalski" <nj********@hot mail.comwrote in message
news:%2******** ********@TK2MSF TNGP03.phx.gbl. ..
>I have tried using CSS properties to control this, but it does not seem to
help. Here is my actual code (I removed the <asp:RectangleH otSpot/tags to
shorten it):

<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center" style="margin:0 px;padding:0px; ">
<asp:ImageMap ID="mapBanner" runat="server"
BorderWidth="0p x" Height="82px" ImageUrl="../images/top_banner.jpg"
Width="1000px" style="margin:0 px;padding:0px; ">
</asp:ImageMap>
<asp:ImageMap ID="mapNavBanne r" runat="server"
Width="1000" Height="19" BorderWidth="0"
ImageUrl="../images/navigation.jpg" style="margin:0 px;padding:0px; ">
</asp:ImageMap>
</td>
</tr>
</table>

I have also tried using two separate table rows, which did not help
either. Any other ideas? Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/

"clintonG" <cs*********@RE MOVETHISTEXTmet romilwaukee.com wrote in message
news:%2******** ********@TK2MSF TNGP03.phx.gbl. ..
>Put each control into a separate Panel or div and use styled margins to
manage white space.

<%= Clinton Gallagher
NET csgallagher AT metromilwaukee. com
URL http://clintongallagher.metromilwaukee.com/
MAP 43°2'17"N 88°2'37"W : 43°2'17"N 88°2'37"W

"Nathan Sokalski" <nj********@hot mail.comwrote in message
news:OZ******* *******@TK2MSFT NGP04.phx.gbl.. .
>>>I am using ASP.NET 2.0's ImageMap Control to create 2 imagemaps, one
directly below the other. When I do this a thin blank space appears
between them. After several days of frustration I realized that the
difference between what the ImageMap Control outputs and the html on the
page I was trying to reproduce with ASP.NET 2.0 was the following:
Handwritten HTML imagemaps (no whitestrip between them):

<table>
<tr>
<td>
<img/><br/>
<map>
<area/>
</map>
<img/><br/>
<map>
<area/>
</map>
</td>
</tr>
</table>

ASP.NET 2.0 generated HTML using the ImageMap Control (whitestrip
appears between the two ImageMaps):

<table>
<tr>
<td>
<img/>
<map>
<area/>
</map>
<img/>
<map>
<area/>
</map>
</td>
</tr>
</table>
In case you didn't see it, the difference is that the handwritten HTML
includes a <br/between the <img/and <maptags. However, this is not
achievable (at least not using any technique I can think of) using the
ASP.NET 2.0 ImageMap Control. What can I do? Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/



Sep 24 '06 #4
That didn't help either. I tried using the following tag layout:

<div style="margin:0 px;padding:0px; ">
<asp:ImageMap ID="mapBanner" runat="server" BorderWidth="0p x"
Height="82px" ImageUrl="../images/top_banner.jpg" Width="1000px"
style="margin:0 px;padding:0px; ">
</asp:ImageMap>
</div>
<div style="margin:0 px;padding:0px; ">
<asp:ImageMap ID="mapNavBanne r" runat="server" Width="1000"
Height="19" BorderWidth="0" ImageUrl="../images/navigation.jpg"
style="margin:0 px;padding:0px; ">
</asp:ImageMap>
</div>

but the whitestrip still shows up between the ImageMaps. Any other ideas?
Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/

"clintonG" <cs*********@RE MOVETHISTEXTmet romilwaukee.com wrote in message
news:uI******** ******@TK2MSFTN GP04.phx.gbl...
Try it the way I suggested. Get them out of the td and into divs of their
own.

<%= Clinton

"Nathan Sokalski" <nj********@hot mail.comwrote in message
news:%2******** ********@TK2MSF TNGP03.phx.gbl. ..
>>I have tried using CSS properties to control this, but it does not seem to
help. Here is my actual code (I removed the <asp:RectangleH otSpot/tags
to shorten it):

<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center" style="margin:0 px;padding:0px; ">
<asp:ImageMap ID="mapBanner" runat="server"
BorderWidth="0 px" Height="82px" ImageUrl="../images/top_banner.jpg"
Width="1000p x" style="margin:0 px;padding:0px; ">
</asp:ImageMap>
<asp:ImageMap ID="mapNavBanne r" runat="server"
Width="1000" Height="19" BorderWidth="0"
ImageUrl="../images/navigation.jpg" style="margin:0 px;padding:0px; ">
</asp:ImageMap>
</td>
</tr>
</table>

I have also tried using two separate table rows, which did not help
either. Any other ideas? Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/

"clintonG" <cs*********@RE MOVETHISTEXTmet romilwaukee.com wrote in
message news:%2******** ********@TK2MSF TNGP03.phx.gbl. ..
>>Put each control into a separate Panel or div and use styled margins to
manage white space.

<%= Clinton Gallagher
NET csgallagher AT metromilwaukee. com
URL http://clintongallagher.metromilwaukee.com/
MAP 43°2'17"N 88°2'37"W : 43°2'17"N 88°2'37"W

"Nathan Sokalski" <nj********@hot mail.comwrote in message
news:OZ****** ********@TK2MSF TNGP04.phx.gbl. ..
I am using ASP.NET 2.0's ImageMap Control to create 2 imagemaps, one
directly below the other. When I do this a thin blank space appears
between them. After several days of frustration I realized that the
differenc e between what the ImageMap Control outputs and the html on the
page I was trying to reproduce with ASP.NET 2.0 was the following:
Handwritte n HTML imagemaps (no whitestrip between them):

<table>
<tr>
<td>
<img/><br/>
<map>
<area/>
</map>
<img/><br/>
<map>
<area/>
</map>
</td>
</tr>
</table>

ASP.NET 2.0 generated HTML using the ImageMap Control (whitestrip
appears between the two ImageMaps):

<table>
<tr>
<td>
<img/>
<map>
<area/>
</map>
<img/>
<map>
<area/>
</map>
</td>
</tr>
</table>
In case you didn't see it, the difference is that the handwritten HTML
includes a <br/between the <img/and <maptags. However, this is
not achievable (at least not using any technique I can think of) using
the ASP.NET 2.0 ImageMap Control. What can I do? Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/



Sep 24 '06 #5
What does the ImageMap control render in the html? A div of its own or the
tables you have been pasting into this news article? You might be asked to
put the images you are using on a server with a URL I or others can look at
before we could help any further.

<%= Clinton

"Nathan Sokalski" <nj********@hot mail.comwrote in message
news:e%******** ********@TK2MSF TNGP04.phx.gbl. ..
That didn't help either. I tried using the following tag layout:

<div style="margin:0 px;padding:0px; ">
<asp:ImageMap ID="mapBanner" runat="server" BorderWidth="0p x"
Height="82px" ImageUrl="../images/top_banner.jpg" Width="1000px"
style="margin:0 px;padding:0px; ">
</asp:ImageMap>
</div>
<div style="margin:0 px;padding:0px; ">
<asp:ImageMap ID="mapNavBanne r" runat="server" Width="1000"
Height="19" BorderWidth="0" ImageUrl="../images/navigation.jpg"
style="margin:0 px;padding:0px; ">
</asp:ImageMap>
</div>

but the whitestrip still shows up between the ImageMaps. Any other ideas?
Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/

"clintonG" <cs*********@RE MOVETHISTEXTmet romilwaukee.com wrote in message
news:uI******** ******@TK2MSFTN GP04.phx.gbl...
>Try it the way I suggested. Get them out of the td and into divs of their
own.

<%= Clinton

"Nathan Sokalski" <nj********@hot mail.comwrote in message
news:%2******* *********@TK2MS FTNGP03.phx.gbl ...
>>>I have tried using CSS properties to control this, but it does not seem
to help. Here is my actual code (I removed the <asp:RectangleH otSpot/>
tags to shorten it):

<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center" style="margin:0 px;padding:0px; ">
<asp:ImageMap ID="mapBanner" runat="server"
BorderWidth=" 0px" Height="82px" ImageUrl="../images/top_banner.jpg"
Width="1000px " style="margin:0 px;padding:0px; ">
</asp:ImageMap>
<asp:ImageMap ID="mapNavBanne r" runat="server"
Width="1000 " Height="19" BorderWidth="0"
ImageUrl=". ./images/navigation.jpg" style="margin:0 px;padding:0px; ">
</asp:ImageMap>
</td>
</tr>
</table>

I have also tried using two separate table rows, which did not help
either. Any other ideas? Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/

"clintonG" <cs*********@RE MOVETHISTEXTmet romilwaukee.com wrote in
message news:%2******** ********@TK2MSF TNGP03.phx.gbl. ..
Put each control into a separate Panel or div and use styled margins to
manage white space.

<%= Clinton Gallagher
NET csgallagher AT metromilwaukee. com
URL http://clintongallagher.metromilwaukee.com/
MAP 43°2'17"N 88°2'37"W : 43°2'17"N 88°2'37"W

"Nathan Sokalski" <nj********@hot mail.comwrote in message
news:OZ***** *********@TK2MS FTNGP04.phx.gbl ...
>I am using ASP.NET 2.0's ImageMap Control to create 2 imagemaps, one
>directly below the other. When I do this a thin blank space appears
>between them. After several days of frustration I realized that the
>differen ce between what the ImageMap Control outputs and the html on
>the page I was trying to reproduce with ASP.NET 2.0 was the following:
>
>
Handwritt en HTML imagemaps (no whitestrip between them):
>
<table>
<tr>
<td>
<img/><br/>
<map>
<area/>
</map>
<img/><br/>
<map>
<area/>
</map>
</td>
</tr>
</table>
>
ASP.NET 2.0 generated HTML using the ImageMap Control (whitestrip
appears between the two ImageMaps):
>
<table>
<tr>
<td>
<img/>
<map>
<area/>
</map>
<img/>
<map>
<area/>
</map>
</td>
</tr>
</table>
>
>
In case you didn't see it, the difference is that the handwritten HTML
includes a <br/between the <img/and <maptags. However, this is
not achievable (at least not using any technique I can think of) using
the ASP.NET 2.0 ImageMap Control. What can I do? Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/
>




Sep 25 '06 #6
The exact code in my *.ascx file is:
<%@ Control Language="vb" AutoEventWireup ="false"
CodeBehind="tit lebanner.ascx.v b" Inherits="AFBE. titlebanner" %>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center" style="margin:0 px;padding:0px; ">
<asp:ImageMap ID="mapBanner" runat="server" BorderWidth="0p x"
Height="82px" ImageUrl="../images/top_banner.jpg" Width="1000px"
style="margin:0 px;padding:0px; ">
<asp:RectangleH otSpot Left="125" Top="5" Right="200" Bottom="22"
NavigateUrl="ab out" AlternateText=" About AFBE" />
<asp:RectangleH otSpot Left="206" Top="5" Right="347" Bottom="22"
NavigateUrl="fo undation" AlternateText=" Foundation Scholarship" />
<asp:RectangleH otSpot Left="353" Top="5" Right="421" Bottom="22"
NavigateUrl="co ntact.asp" AlternateText=" Contact Us" />
<asp:RectangleH otSpot Left="425" Top="5" Right="511" Bottom="22"
NavigateUrl="af filiates" AlternateText=" Affiliate Login" />
<asp:RectangleH otSpot Left="857" Top="37" Right="896" Bottom="65"
NavigateUrl="" AlternateText=" English Version" />
<asp:RectangleH otSpot Left="902" Top="37" Right="940" Bottom="65"
NavigateUrl="es panol" AlternateText=" Spanish Version" />
<asp:RectangleH otSpot Left="946" Top="37" Right="984" Bottom="65"
NavigateUrl="fr ancis" AlternateText=" French Version" />
</asp:ImageMap>
<asp:ImageMap ID="mapNavBanne r" runat="server" Width="1000" Height="19"
BorderWidth="0" ImageUrl="../images/navigation.jpg"
style="margin:0 px;padding:0px; ">
<asp:RectangleH otSpot Left="7" Top="1" Right="188" Bottom="16"
NavigateUrl="ex posure" AlternateText=" National Exposure Service" />
<asp:RectangleH otSpot Left="203" Top="1" Right="323" Bottom="16"
NavigateUrl="at hletes" AlternateText=" Athlete Database" />
<asp:RectangleH otSpot Left="336" Top="1" Right="428" Bottom="16"
NavigateUrl="to urnaments" AlternateText=" Tournaments" />
<asp:RectangleH otSpot Left="442" Top="1" Right="555" Bottom="16"
NavigateUrl="su mmercamps" AlternateText=" Summer Camps" />
<asp:RectangleH otSpot Left="569" Top="1" Right="659" Bottom="16"
NavigateUrl="co aches" AlternateText=" For Coaches" />
<asp:RectangleH otSpot Left="673" Top="1" Right="858" Bottom="16"
NavigateUrl="op portunities" AlternateText=" Employment Opportunities" />
<asp:RectangleH otSpot Left="873" Top="1" Right="917" Bottom="16"
NavigateUrl="" AlternateText=" Home" />
</asp:ImageMap>
</td>
</tr>
</table>
The exact code that this renders is:
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center" style="margin:0 px;padding:0px; ">
<img id="titlebanner 1_mapBanner" src="images/top_banner.jpg"
usemap="#ImageM aptitlebanner1_ mapBanner"
style="border-width:0px;heigh t:82px;width:10 00px;margin:0px ;padding:0px;"
/><map name="ImageMapt itlebanner1_map Banner">
<area shape="rect" coords="125,5,2 00,22" href="usercontr ols/about"
title="About AFBE" alt="About AFBE" /><area shape="rect"
coords="206,5,3 47,22" href="usercontr ols/foundation" title="Foundati on
Scholarship" alt="Foundation Scholarship" /><area shape="rect"
coords="353,5,4 21,22" href="usercontr ols/contact.asp" title="Contact Us"
alt="Contact Us" /><area shape="rect" coords="425,5,5 11,22"
href="usercontr ols/affiliates" title="Affiliat e Login" alt="Affiliate Login"
/><area shape="rect" coords="857,37, 896,65" href="" title="English Version"
alt="English Version" /><area shape="rect" coords="902,37, 940,65"
href="usercontr ols/espanol" title="Spanish Version" alt="Spanish Version"
/><area shape="rect" coords="946,37, 984,65" href="usercontr ols/francis"
title="French Version" alt="French Version" />
</map>
<img id="titlebanner 1_mapNavBanner" src="images/navigation.jpg"
usemap="#ImageM aptitlebanner1_ mapNavBanner"
style="border-width:0px;heigh t:19px;width:10 00px;margin:0px ;padding:0px;"
/><map name="ImageMapt itlebanner1_map NavBanner">
<area shape="rect" coords="7,1,188 ,16" href="usercontr ols/exposure"
title="National Exposure Service" alt="National Exposure Service" /><area
shape="rect" coords="203,1,3 23,16" href="usercontr ols/athletes"
title="Athlete Database" alt="Athlete Database" /><area shape="rect"
coords="336,1,4 28,16" href="usercontr ols/tournaments" title="Tourname nts"
alt="Tournament s" /><area shape="rect" coords="442,1,5 55,16"
href="usercontr ols/summercamps" title="Summer Camps" alt="Summer Camps"
/><area shape="rect" coords="569,1,6 59,16" href="usercontr ols/coaches"
title="For Coaches" alt="For Coaches" /><area shape="rect"
coords="673,1,8 58,16" href="usercontr ols/opportunities" title="Employme nt
Opportunities" alt="Employment Opportunities" /><area shape="rect"
coords="873,1,9 17,16" href="" title="Home" alt="Home" />
</map>
</td>
</tr>
</table>
I don't know why it would help, but the two images are located at:

http://www.mosaicinc.net/clients/afb...top_banner.jpg
http://www.mosaicinc.net/clients/afb...navigation.jpg

The width & height that I specify in my code (1000x82 & 1000x19) are
correct, and I also tried not specifying a width & height, but neither made
any difference. The only working solution I have found is to write the html
by hand and place a <br/between the img & map tags. If you go to:

http://www.mosaicinc.net/clients/afbe/

you can see the two imagemaps at the top without any empty space between
them. But if you look at the source code, you will notice that there is a
<brtag between the img and map tags (the page that is currently there is
written in Classic ASP, I need to convert it to ASP.NET, and I would rather
use the ImageMap control than manually write the html). If there is any
other information that might help you help me find a solution, let me know.
Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/

"clintonG" <cs*********@RE MOVETHISTEXTmet romilwaukee.com wrote in message
news:O$******** ******@TK2MSFTN GP04.phx.gbl...
What does the ImageMap control render in the html? A div of its own or the
tables you have been pasting into this news article? You might be asked to
put the images you are using on a server with a URL I or others can look
at before we could help any further.

<%= Clinton

"Nathan Sokalski" <nj********@hot mail.comwrote in message
news:e%******** ********@TK2MSF TNGP04.phx.gbl. ..
>That didn't help either. I tried using the following tag layout:

<div style="margin:0 px;padding:0px; ">
<asp:ImageMap ID="mapBanner" runat="server" BorderWidth="0p x"
Height="82px " ImageUrl="../images/top_banner.jpg" Width="1000px"
style="margin: 0px;padding:0px ;">
</asp:ImageMap>
</div>
<div style="margin:0 px;padding:0px; ">
<asp:ImageMap ID="mapNavBanne r" runat="server" Width="1000"
Height="19" BorderWidth="0" ImageUrl="../images/navigation.jpg"
style="margin: 0px;padding:0px ;">
</asp:ImageMap>
</div>

but the whitestrip still shows up between the ImageMaps. Any other ideas?
Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/

"clintonG" <cs*********@RE MOVETHISTEXTmet romilwaukee.com wrote in
message news:uI******** ******@TK2MSFTN GP04.phx.gbl...
>>Try it the way I suggested. Get them out of the td and into divs of
their own.

<%= Clinton

"Nathan Sokalski" <nj********@hot mail.comwrote in message
news:%2****** **********@TK2M SFTNGP03.phx.gb l...
I have tried using CSS properties to control this, but it does not seem
to help. Here is my actual code (I removed the <asp:RectangleH otSpot/>
tags to shorten it):

<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center" style="margin:0 px;padding:0px; ">
<asp:ImageMap ID="mapBanner" runat="server"
BorderWidth= "0px" Height="82px" ImageUrl="../images/top_banner.jpg"
Width="1000p x" style="margin:0 px;padding:0px; ">
</asp:ImageMap>
<asp:ImageMap ID="mapNavBanne r" runat="server"
Width="100 0" Height="19" BorderWidth="0"
ImageUrl=" ../images/navigation.jpg" style="margin:0 px;padding:0px; ">
</asp:ImageMap>
</td>
</tr>
</table>

I have also tried using two separate table rows, which did not help
either. Any other ideas? Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/

"clintonG" <cs*********@RE MOVETHISTEXTmet romilwaukee.com wrote in
message news:%2******** ********@TK2MSF TNGP03.phx.gbl. ..
Put each control into a separate Panel or div and use styled margins
to manage white space.
>
<%= Clinton Gallagher
NET csgallagher AT metromilwaukee. com
URL http://clintongallagher.metromilwaukee.com/
MAP 43°2'17"N 88°2'37"W : 43°2'17"N 88°2'37"W
>
"Nathan Sokalski" <nj********@hot mail.comwrote in message
news:OZ**** **********@TK2M SFTNGP04.phx.gb l...
>>I am using ASP.NET 2.0's ImageMap Control to create 2 imagemaps, one
>>directl y below the other. When I do this a thin blank space appears
>>between them. After several days of frustration I realized that the
>>differenc e between what the ImageMap Control outputs and the html on
>>the page I was trying to reproduce with ASP.NET 2.0 was the following:
>>
>>
>Handwritte n HTML imagemaps (no whitestrip between them):
>>
><table>
> <tr>
> <td>
> <img/><br/>
> <map>
> <area/>
> </map>
> <img/><br/>
> <map>
> <area/>
> </map>
> </td>
> </tr>
></table>
>>
>ASP.NET 2.0 generated HTML using the ImageMap Control (whitestrip
>appears between the two ImageMaps):
>>
><table>
> <tr>
> <td>
> <img/>
> <map>
> <area/>
> </map>
> <img/>
> <map>
> <area/>
> </map>
> </td>
> </tr>
></table>
>>
>>
>In case you didn't see it, the difference is that the handwritten
>HTML includes a <br/between the <img/and <maptags. However,
>this is not achievable (at least not using any technique I can think
>of) using the ASP.NET 2.0 ImageMap Control. What can I do? Thanks.
>--
>Nathan Sokalski
>nj********@hotm ail.com
>http://www.nathansokalski.com/
>>
>
>




Sep 25 '06 #7
Here's the solution I tried to explain to you...

<div id="MapBanner" >
<asp:ImageMap ID="mapBanner" runat="server" ImageUrl="top_b anner.jpg"
ImageAlign="Bot tom" Height="82px">
</asp:ImageMap>
</div>

<div id="MapNavBanne r" style="margin:-.25em 0 0 0;">
<asp:ImageMap ID="mapNavBanne r" runat="server" ImageUrl="navig ation.jpg"
ImageAlign="Top " Height="19px">
</asp:ImageMap>
</div>
<%= Clinton Gallagher
NET csgallagher AT metromilwaukee. com
URL http://clintongallagher.metromilwaukee.com/
MAP 43°2'17"N 88°2'37"W : 43°2'17"N 88°2'37"W
"Nathan Sokalski" <nj********@hot mail.comwrote in message
news:eE******** ******@TK2MSFTN GP06.phx.gbl...
The exact code in my *.ascx file is:
<%@ Control Language="vb" AutoEventWireup ="false"
CodeBehind="tit lebanner.ascx.v b" Inherits="AFBE. titlebanner" %>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center" style="margin:0 px;padding:0px; ">
<asp:ImageMap ID="mapBanner" runat="server" BorderWidth="0p x"
Height="82px" ImageUrl="../images/top_banner.jpg" Width="1000px"
style="margin:0 px;padding:0px; ">
<asp:RectangleH otSpot Left="125" Top="5" Right="200" Bottom="22"
NavigateUrl="ab out" AlternateText=" About AFBE" />
<asp:RectangleH otSpot Left="206" Top="5" Right="347" Bottom="22"
NavigateUrl="fo undation" AlternateText=" Foundation Scholarship" />
<asp:RectangleH otSpot Left="353" Top="5" Right="421" Bottom="22"
NavigateUrl="co ntact.asp" AlternateText=" Contact Us" />
<asp:RectangleH otSpot Left="425" Top="5" Right="511" Bottom="22"
NavigateUrl="af filiates" AlternateText=" Affiliate Login" />
<asp:RectangleH otSpot Left="857" Top="37" Right="896" Bottom="65"
NavigateUrl="" AlternateText=" English Version" />
<asp:RectangleH otSpot Left="902" Top="37" Right="940" Bottom="65"
NavigateUrl="es panol" AlternateText=" Spanish Version" />
<asp:RectangleH otSpot Left="946" Top="37" Right="984" Bottom="65"
NavigateUrl="fr ancis" AlternateText=" French Version" />
</asp:ImageMap>
<asp:ImageMap ID="mapNavBanne r" runat="server" Width="1000" Height="19"
BorderWidth="0" ImageUrl="../images/navigation.jpg"
style="margin:0 px;padding:0px; ">
<asp:RectangleH otSpot Left="7" Top="1" Right="188" Bottom="16"
NavigateUrl="ex posure" AlternateText=" National Exposure Service" />
<asp:RectangleH otSpot Left="203" Top="1" Right="323" Bottom="16"
NavigateUrl="at hletes" AlternateText=" Athlete Database" />
<asp:RectangleH otSpot Left="336" Top="1" Right="428" Bottom="16"
NavigateUrl="to urnaments" AlternateText=" Tournaments" />
<asp:RectangleH otSpot Left="442" Top="1" Right="555" Bottom="16"
NavigateUrl="su mmercamps" AlternateText=" Summer Camps" />
<asp:RectangleH otSpot Left="569" Top="1" Right="659" Bottom="16"
NavigateUrl="co aches" AlternateText=" For Coaches" />
<asp:RectangleH otSpot Left="673" Top="1" Right="858" Bottom="16"
NavigateUrl="op portunities" AlternateText=" Employment Opportunities" />
<asp:RectangleH otSpot Left="873" Top="1" Right="917" Bottom="16"
NavigateUrl="" AlternateText=" Home" />
</asp:ImageMap>
</td>
</tr>
</table>
The exact code that this renders is:
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center" style="margin:0 px;padding:0px; ">
<img id="titlebanner 1_mapBanner" src="images/top_banner.jpg"
usemap="#ImageM aptitlebanner1_ mapBanner"
style="border-width:0px;heigh t:82px;width:10 00px;margin:0px ;padding:0px;"
/><map name="ImageMapt itlebanner1_map Banner">
<area shape="rect" coords="125,5,2 00,22" href="usercontr ols/about"
title="About AFBE" alt="About AFBE" /><area shape="rect"
coords="206,5,3 47,22" href="usercontr ols/foundation" title="Foundati on
Scholarship" alt="Foundation Scholarship" /><area shape="rect"
coords="353,5,4 21,22" href="usercontr ols/contact.asp" title="Contact Us"
alt="Contact Us" /><area shape="rect" coords="425,5,5 11,22"
href="usercontr ols/affiliates" title="Affiliat e Login" alt="Affiliate
Login" /><area shape="rect" coords="857,37, 896,65" href="" title="English
Version" alt="English Version" /><area shape="rect" coords="902,37, 940,65"
href="usercontr ols/espanol" title="Spanish Version" alt="Spanish Version"
/><area shape="rect" coords="946,37, 984,65" href="usercontr ols/francis"
title="French Version" alt="French Version" />
</map>
<img id="titlebanner 1_mapNavBanner" src="images/navigation.jpg"
usemap="#ImageM aptitlebanner1_ mapNavBanner"
style="border-width:0px;heigh t:19px;width:10 00px;margin:0px ;padding:0px;"
/><map name="ImageMapt itlebanner1_map NavBanner">
<area shape="rect" coords="7,1,188 ,16" href="usercontr ols/exposure"
title="National Exposure Service" alt="National Exposure Service" /><area
shape="rect" coords="203,1,3 23,16" href="usercontr ols/athletes"
title="Athlete Database" alt="Athlete Database" /><area shape="rect"
coords="336,1,4 28,16" href="usercontr ols/tournaments" title="Tourname nts"
alt="Tournament s" /><area shape="rect" coords="442,1,5 55,16"
href="usercontr ols/summercamps" title="Summer Camps" alt="Summer Camps"
/><area shape="rect" coords="569,1,6 59,16" href="usercontr ols/coaches"
title="For Coaches" alt="For Coaches" /><area shape="rect"
coords="673,1,8 58,16" href="usercontr ols/opportunities" title="Employme nt
Opportunities" alt="Employment Opportunities" /><area shape="rect"
coords="873,1,9 17,16" href="" title="Home" alt="Home" />
</map>
</td>
</tr>
</table>
I don't know why it would help, but the two images are located at:

http://www.mosaicinc.net/clients/afb...top_banner.jpg
http://www.mosaicinc.net/clients/afb...navigation.jpg

The width & height that I specify in my code (1000x82 & 1000x19) are
correct, and I also tried not specifying a width & height, but neither
made any difference. The only working solution I have found is to write
the html by hand and place a <br/between the img & map tags. If you go
to:

http://www.mosaicinc.net/clients/afbe/

you can see the two imagemaps at the top without any empty space between
them. But if you look at the source code, you will notice that there is a
<brtag between the img and map tags (the page that is currently there is
written in Classic ASP, I need to convert it to ASP.NET, and I would
rather use the ImageMap control than manually write the html). If there is
any other information that might help you help me find a solution, let me
know. Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/

"clintonG" <cs*********@RE MOVETHISTEXTmet romilwaukee.com wrote in message
news:O$******** ******@TK2MSFTN GP04.phx.gbl...
>What does the ImageMap control render in the html? A div of its own or
the tables you have been pasting into this news article? You might be
asked to put the images you are using on a server with a URL I or others
can look at before we could help any further.

<%= Clinton

"Nathan Sokalski" <nj********@hot mail.comwrote in message
news:e%******* *********@TK2MS FTNGP04.phx.gbl ...
>>That didn't help either. I tried using the following tag layout:

<div style="margin:0 px;padding:0px; ">
<asp:ImageMap ID="mapBanner" runat="server" BorderWidth="0p x"
Height="82p x" ImageUrl="../images/top_banner.jpg" Width="1000px"
style="margin :0px;padding:0p x;">
</asp:ImageMap>
</div>
<div style="margin:0 px;padding:0px; ">
<asp:ImageMap ID="mapNavBanne r" runat="server" Width="1000"
Height="19" BorderWidth="0" ImageUrl="../images/navigation.jpg"
style="margin :0px;padding:0p x;">
</asp:ImageMap>
</div>

but the whitestrip still shows up between the ImageMaps. Any other
ideas? Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/

"clintonG" <cs*********@RE MOVETHISTEXTmet romilwaukee.com wrote in
message news:uI******** ******@TK2MSFTN GP04.phx.gbl...
Try it the way I suggested. Get them out of the td and into divs of
their own.

<%= Clinton

"Nathan Sokalski" <nj********@hot mail.comwrote in message
news:%2***** ***********@TK2 MSFTNGP03.phx.g bl...
>I have tried using CSS properties to control this, but it does not seem
>to help. Here is my actual code (I removed the <asp:RectangleH otSpot/>
>tags to shorten it):
>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center" style="margin:0 px;padding:0px; ">
<asp:ImageMap ID="mapBanner" runat="server"
BorderWidth ="0px" Height="82px" ImageUrl="../images/top_banner.jpg"
Width="1000 px" style="margin:0 px;padding:0px; ">
</asp:ImageMap>
<asp:ImageMap ID="mapNavBanne r" runat="server"
Width="1000 " Height="19" BorderWidth="0"
ImageUrl=". ./images/navigation.jpg" style="margin:0 px;padding:0px; ">
</asp:ImageMap>
</td>
</tr>
</table>
>
I have also tried using two separate table rows, which did not help
either. Any other ideas? Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/
>
"clintonG " <cs*********@RE MOVETHISTEXTmet romilwaukee.com wrote in
message news:%2******** ********@TK2MSF TNGP03.phx.gbl. ..
>Put each control into a separate Panel or div and use styled margins
>to manage white space.
>>
><%= Clinton Gallagher
> NET csgallagher AT metromilwaukee. com
> URL http://clintongallagher.metromilwaukee.com/
> MAP 43°2'17"N 88°2'37"W : 43°2'17"N 88°2'37"W
>>
>"Nathan Sokalski" <nj********@hot mail.comwrote in message
>news:OZ*** ***********@TK2 MSFTNGP04.phx.g bl...
>>>I am using ASP.NET 2.0's ImageMap Control to create 2 imagemaps, one
>>>direct ly below the other. When I do this a thin blank space appears
>>>betwee n them. After several days of frustration I realized that the
>>>differen ce between what the ImageMap Control outputs and the html on
>>>the page I was trying to reproduce with ASP.NET 2.0 was the
>>>followin g:
>>>
>>>
>>Handwritt en HTML imagemaps (no whitestrip between them):
>>>
>><table>
>> <tr>
>> <td>
>> <img/><br/>
>> <map>
>> <area/>
>> </map>
>> <img/><br/>
>> <map>
>> <area/>
>> </map>
>> </td>
>> </tr>
>></table>
>>>
>>ASP.NET 2.0 generated HTML using the ImageMap Control (whitestrip
>>appears between the two ImageMaps):
>>>
>><table>
>> <tr>
>> <td>
>> <img/>
>> <map>
>> <area/>
>> </map>
>> <img/>
>> <map>
>> <area/>
>> </map>
>> </td>
>> </tr>
>></table>
>>>
>>>
>>In case you didn't see it, the difference is that the handwritten
>>HTML includes a <br/between the <img/and <maptags. However,
>>this is not achievable (at least not using any technique I can think
>>of) using the ASP.NET 2.0 ImageMap Control. What can I do? Thanks.
>>--
>>Nathan Sokalski
>>nj********@hotm ail.com
>>http://www.nathansokalski.com/
>>>
>>
>>
>
>




Sep 25 '06 #8
Not to sound unappreciative, but I don't like that idea. That idea had
occurred to me, but because it is so important that these two ImageMaps are
EXACTLY touching (not almost touching, not overlapping) and different
browsers and versions would require a different value for the adjustment, I
want something that either uses 0 or does not require an adjustment. At the
moment, I feel I may need to write the imagemap html by hand due to my time
constraints, but I would like to let Microsoft know about this problem
(unless there is a way around it which works that we haven't found). I
haven't looked into it, but I have seen mentionings of a .NET 3.0 in certain
places on the web. I am wondering if this problem is fixed in that. Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/

"clintonG" <cs*********@RE MOVETHISTEXTmet romilwaukee.com wrote in message
news:OV******** ******@TK2MSFTN GP04.phx.gbl...
Here's the solution I tried to explain to you...

<div id="MapBanner" >
<asp:ImageMap ID="mapBanner" runat="server" ImageUrl="top_b anner.jpg"
ImageAlign="Bot tom" Height="82px">
</asp:ImageMap>
</div>

<div id="MapNavBanne r" style="margin:-.25em 0 0 0;">
<asp:ImageMap ID="mapNavBanne r" runat="server" ImageUrl="navig ation.jpg"
ImageAlign="Top " Height="19px">
</asp:ImageMap>
</div>
<%= Clinton Gallagher
NET csgallagher AT metromilwaukee. com
URL http://clintongallagher.metromilwaukee.com/
MAP 43°2'17"N 88°2'37"W : 43°2'17"N 88°2'37"W
"Nathan Sokalski" <nj********@hot mail.comwrote in message
news:eE******** ******@TK2MSFTN GP06.phx.gbl...
>The exact code in my *.ascx file is:
<%@ Control Language="vb" AutoEventWireup ="false"
CodeBehind="ti tlebanner.ascx. vb" Inherits="AFBE. titlebanner" %>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center" style="margin:0 px;padding:0px; ">
<asp:ImageMap ID="mapBanner" runat="server" BorderWidth="0p x"
Height="82px " ImageUrl="../images/top_banner.jpg" Width="1000px"
style="margin: 0px;padding:0px ;">
<asp:RectangleH otSpot Left="125" Top="5" Right="200" Bottom="22"
NavigateUrl="a bout" AlternateText=" About AFBE" />
<asp:RectangleH otSpot Left="206" Top="5" Right="347" Bottom="22"
NavigateUrl="f oundation" AlternateText=" Foundation Scholarship" />
<asp:RectangleH otSpot Left="353" Top="5" Right="421" Bottom="22"
NavigateUrl="c ontact.asp" AlternateText=" Contact Us" />
<asp:RectangleH otSpot Left="425" Top="5" Right="511" Bottom="22"
NavigateUrl="a ffiliates" AlternateText=" Affiliate Login" />
<asp:RectangleH otSpot Left="857" Top="37" Right="896" Bottom="65"
NavigateUrl= "" AlternateText=" English Version" />
<asp:RectangleH otSpot Left="902" Top="37" Right="940" Bottom="65"
NavigateUrl="e spanol" AlternateText=" Spanish Version" />
<asp:RectangleH otSpot Left="946" Top="37" Right="984" Bottom="65"
NavigateUrl="f rancis" AlternateText=" French Version" />
</asp:ImageMap>
<asp:ImageMap ID="mapNavBanne r" runat="server" Width="1000" Height="19"
BorderWidth="0 " ImageUrl="../images/navigation.jpg"
style="margin: 0px;padding:0px ;">
<asp:RectangleH otSpot Left="7" Top="1" Right="188" Bottom="16"
NavigateUrl="e xposure" AlternateText=" National Exposure Service" />
<asp:RectangleH otSpot Left="203" Top="1" Right="323" Bottom="16"
NavigateUrl="a thletes" AlternateText=" Athlete Database" />
<asp:RectangleH otSpot Left="336" Top="1" Right="428" Bottom="16"
NavigateUrl="t ournaments" AlternateText=" Tournaments" />
<asp:RectangleH otSpot Left="442" Top="1" Right="555" Bottom="16"
NavigateUrl="s ummercamps" AlternateText=" Summer Camps" />
<asp:RectangleH otSpot Left="569" Top="1" Right="659" Bottom="16"
NavigateUrl="c oaches" AlternateText=" For Coaches" />
<asp:RectangleH otSpot Left="673" Top="1" Right="858" Bottom="16"
NavigateUrl="o pportunities" AlternateText=" Employment Opportunities" />
<asp:RectangleH otSpot Left="873" Top="1" Right="917" Bottom="16"
NavigateUrl= "" AlternateText=" Home" />
</asp:ImageMap>
</td>
</tr>
</table>
The exact code that this renders is:
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center" style="margin:0 px;padding:0px; ">
<img id="titlebanner 1_mapBanner" src="images/top_banner.jpg"
usemap="#Image Maptitlebanner1 _mapBanner"
style="borde r-width:0px;heigh t:82px;width:10 00px;margin:0px ;padding:0px;"
/><map name="ImageMapt itlebanner1_map Banner">
<area shape="rect" coords="125,5,2 00,22" href="usercontr ols/about"
title="About AFBE" alt="About AFBE" /><area shape="rect"
coords="206,5, 347,22" href="usercontr ols/foundation" title="Foundati on
Scholarship" alt="Foundation Scholarship" /><area shape="rect"
coords="353,5, 421,22" href="usercontr ols/contact.asp" title="Contact Us"
alt="Contact Us" /><area shape="rect" coords="425,5,5 11,22"
href="usercont rols/affiliates" title="Affiliat e Login" alt="Affiliate
Login" /><area shape="rect" coords="857,37, 896,65" href="" title="English
Version" alt="English Version" /><area shape="rect"
coords="902,37 ,940,65" href="usercontr ols/espanol" title="Spanish
Version" alt="Spanish Version" /><area shape="rect"
coords="946,37 ,984,65" href="usercontr ols/francis" title="French Version"
alt="French Version" />
</map>
<img id="titlebanner 1_mapNavBanner" src="images/navigation.jpg"
usemap="#Image Maptitlebanner1 _mapNavBanner"
style="borde r-width:0px;heigh t:19px;width:10 00px;margin:0px ;padding:0px;"
/><map name="ImageMapt itlebanner1_map NavBanner">
<area shape="rect" coords="7,1,188 ,16" href="usercontr ols/exposure"
title="Nationa l Exposure Service" alt="National Exposure Service" /><area
shape="rect" coords="203,1,3 23,16" href="usercontr ols/athletes"
title="Athle te Database" alt="Athlete Database" /><area shape="rect"
coords="336,1, 428,16" href="usercontr ols/tournaments" title="Tourname nts"
alt="Tournamen ts" /><area shape="rect" coords="442,1,5 55,16"
href="usercont rols/summercamps" title="Summer Camps" alt="Summer Camps"
/><area shape="rect" coords="569,1,6 59,16" href="usercontr ols/coaches"
title="For Coaches" alt="For Coaches" /><area shape="rect"
coords="673,1, 858,16" href="usercontr ols/opportunities" title="Employme nt
Opportunitie s" alt="Employment Opportunities" /><area shape="rect"
coords="873,1, 917,16" href="" title="Home" alt="Home" />
</map>
</td>
</tr>
</table>
I don't know why it would help, but the two images are located at:

http://www.mosaicinc.net/clients/afb...top_banner.jpg
http://www.mosaicinc.net/clients/afb...navigation.jpg

The width & height that I specify in my code (1000x82 & 1000x19) are
correct, and I also tried not specifying a width & height, but neither
made any difference. The only working solution I have found is to write
the html by hand and place a <br/between the img & map tags. If you go
to:

http://www.mosaicinc.net/clients/afbe/

you can see the two imagemaps at the top without any empty space between
them. But if you look at the source code, you will notice that there is a
<brtag between the img and map tags (the page that is currently there
is written in Classic ASP, I need to convert it to ASP.NET, and I would
rather use the ImageMap control than manually write the html). If there
is any other information that might help you help me find a solution, let
me know. Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/

"clintonG" <cs*********@RE MOVETHISTEXTmet romilwaukee.com wrote in
message news:O$******** ******@TK2MSFTN GP04.phx.gbl...
>>What does the ImageMap control render in the html? A div of its own or
the tables you have been pasting into this news article? You might be
asked to put the images you are using on a server with a URL I or others
can look at before we could help any further.

<%= Clinton

"Nathan Sokalski" <nj********@hot mail.comwrote in message
news:e%****** **********@TK2M SFTNGP04.phx.gb l...
That didn't help either. I tried using the following tag layout:

<div style="margin:0 px;padding:0px; ">
<asp:ImageMap ID="mapBanner" runat="server" BorderWidth="0p x"
Height="82px " ImageUrl="../images/top_banner.jpg" Width="1000px"
style="margi n:0px;padding:0 px;">
</asp:ImageMap>
</div>
<div style="margin:0 px;padding:0px; ">
<asp:ImageMap ID="mapNavBanne r" runat="server" Width="1000"
Height="19 " BorderWidth="0" ImageUrl="../images/navigation.jpg"
style="margi n:0px;padding:0 px;">
</asp:ImageMap>
</div>

but the whitestrip still shows up between the ImageMaps. Any other
ideas? Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/

"clintonG" <cs*********@RE MOVETHISTEXTmet romilwaukee.com wrote in
message news:uI******** ******@TK2MSFTN GP04.phx.gbl...
Try it the way I suggested. Get them out of the td and into divs of
their own.
>
<%= Clinton
>
"Nathan Sokalski" <nj********@hot mail.comwrote in message
news:%2**** ************@TK 2MSFTNGP03.phx. gbl...
>>I have tried using CSS properties to control this, but it does not
>>seem to help. Here is my actual code (I removed the
>><asp:Rect angleHotSpot/tags to shorten it):
>>
><table border="0" cellpadding="0" cellspacing="0" width="100%">
> <tr>
> <td align="center" style="margin:0 px;padding:0px; ">
> <asp:ImageMap ID="mapBanner" runat="server"
>BorderWidt h="0px" Height="82px" ImageUrl="../images/top_banner.jpg"
>Width="100 0px" style="margin:0 px;padding:0px; ">
> </asp:ImageMap>
> <asp:ImageMap ID="mapNavBanne r" runat="server"
>Width="100 0" Height="19" BorderWidth="0"
>ImageUrl=" ../images/navigation.jpg" style="margin:0 px;padding:0px; ">
> </asp:ImageMap>
> </td>
> </tr>
></table>
>>
>I have also tried using two separate table rows, which did not help
>either. Any other ideas? Thanks.
>--
>Nathan Sokalski
>nj********@hotm ail.com
>http://www.nathansokalski.com/
>>
>"clinton G" <cs*********@RE MOVETHISTEXTmet romilwaukee.com wrote in
>message news:%2******** ********@TK2MSF TNGP03.phx.gbl. ..
>>Put each control into a separate Panel or div and use styled margins
>>to manage white space.
>>>
>><%= Clinton Gallagher
>> NET csgallagher AT metromilwaukee. com
>> URL http://clintongallagher.metromilwaukee.com/
>> MAP 43°2'17"N 88°2'37"W : 43°2'17"N 88°2'37"W
>>>
>>"Nathan Sokalski" <nj********@hot mail.comwrote in message
>>news:OZ** ************@TK 2MSFTNGP04.phx. gbl...
>>>>I am using ASP.NET 2.0's ImageMap Control to create 2 imagemaps, one
>>>>directl y below the other. When I do this a thin blank space appears
>>>>betwe en them. After several days of frustration I realized that the
>>>>differe nce between what the ImageMap Control outputs and the html on
>>>>the page I was trying to reproduce with ASP.NET 2.0 was the
>>>>followi ng:
>>>>
>>>>
>>>Handwrit ten HTML imagemaps (no whitestrip between them):
>>>>
>>><table >
>>> <tr>
>>> <td>
>>> <img/><br/>
>>> <map>
>>> <area/>
>>> </map>
>>> <img/><br/>
>>> <map>
>>> <area/>
>>> </map>
>>> </td>
>>> </tr>
>>></table>
>>>>
>>>ASP.NE T 2.0 generated HTML using the ImageMap Control (whitestrip
>>>appear s between the two ImageMaps):
>>>>
>>><table >
>>> <tr>
>>> <td>
>>> <img/>
>>> <map>
>>> <area/>
>>> </map>
>>> <img/>
>>> <map>
>>> <area/>
>>> </map>
>>> </td>
>>> </tr>
>>></table>
>>>>
>>>>
>>>In case you didn't see it, the difference is that the handwritten
>>>HTML includes a <br/between the <img/and <maptags. However,
>>>this is not achievable (at least not using any technique I can
>>>think of) using the ASP.NET 2.0 ImageMap Control. What can I do?
>>>Thanks .
>>>--
>>>Nathan Sokalski
>>>nj********@hotm ail.com
>>>http://www.nathansokalski.com/
>>>>
>>>
>>>
>>
>>
>
>




Sep 25 '06 #9
Thanks for wasting my time moron.

<%= Clinton Gallagher
NET csgallagher AT metromilwaukee. com
URL http://clintongallagher.metromilwaukee.com/
MAP 43°2'17"N 88°2'37"W : 43°2'17"N 88°2'37"W
"Nathan Sokalski" <nj********@hot mail.comwrote in message
news:eq******** ******@TK2MSFTN GP06.phx.gbl...
Not to sound unappreciative, but I don't like that idea. That idea had
occurred to me, but because it is so important that these two ImageMaps
are EXACTLY touching (not almost touching, not overlapping) and different
browsers and versions would require a different value for the adjustment,
I want something that either uses 0 or does not require an adjustment. At
the moment, I feel I may need to write the imagemap html by hand due to my
time constraints, but I would like to let Microsoft know about this
problem (unless there is a way around it which works that we haven't
found). I haven't looked into it, but I have seen mentionings of a .NET
3.0 in certain places on the web. I am wondering if this problem is fixed
in that. Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/

"clintonG" <cs*********@RE MOVETHISTEXTmet romilwaukee.com wrote in message
news:OV******** ******@TK2MSFTN GP04.phx.gbl...
>Here's the solution I tried to explain to you...

<div id="MapBanner" >
<asp:ImageMa p ID="mapBanner" runat="server" ImageUrl="top_b anner.jpg"
ImageAlign="Bo ttom" Height="82px">
</asp:ImageMap>
</div>

<div id="MapNavBanne r" style="margin:-.25em 0 0 0;">
<asp:ImageMa p ID="mapNavBanne r" runat="server" ImageUrl="navig ation.jpg"
ImageAlign="To p" Height="19px">
</asp:ImageMap>
</div>
<%= Clinton Gallagher
NET csgallagher AT metromilwaukee. com
URL http://clintongallagher.metromilwaukee.com/
MAP 43°2'17"N 88°2'37"W : 43°2'17"N 88°2'37"W
"Nathan Sokalski" <nj********@hot mail.comwrote in message
news:eE******* *******@TK2MSFT NGP06.phx.gbl.. .
>>The exact code in my *.ascx file is:
<%@ Control Language="vb" AutoEventWireup ="false"
CodeBehind="t itlebanner.ascx .vb" Inherits="AFBE. titlebanner" %>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center" style="margin:0 px;padding:0px; ">
<asp:ImageMap ID="mapBanner" runat="server" BorderWidth="0p x"
Height="82p x" ImageUrl="../images/top_banner.jpg" Width="1000px"
style="margin :0px;padding:0p x;">
<asp:RectangleH otSpot Left="125" Top="5" Right="200" Bottom="22"
NavigateUrl=" about" AlternateText=" About AFBE" />
<asp:RectangleH otSpot Left="206" Top="5" Right="347" Bottom="22"
NavigateUrl=" foundation" AlternateText=" Foundation Scholarship" />
<asp:RectangleH otSpot Left="353" Top="5" Right="421" Bottom="22"
NavigateUrl=" contact.asp" AlternateText=" Contact Us" />
<asp:RectangleH otSpot Left="425" Top="5" Right="511" Bottom="22"
NavigateUrl=" affiliates" AlternateText=" Affiliate Login" />
<asp:RectangleH otSpot Left="857" Top="37" Right="896" Bottom="65"
NavigateUrl=" " AlternateText=" English Version" />
<asp:RectangleH otSpot Left="902" Top="37" Right="940" Bottom="65"
NavigateUrl=" espanol" AlternateText=" Spanish Version" />
<asp:RectangleH otSpot Left="946" Top="37" Right="984" Bottom="65"
NavigateUrl=" francis" AlternateText=" French Version" />
</asp:ImageMap>
<asp:ImageMap ID="mapNavBanne r" runat="server" Width="1000"
Height="19" BorderWidth="0" ImageUrl="../images/navigation.jpg"
style="margin :0px;padding:0p x;">
<asp:RectangleH otSpot Left="7" Top="1" Right="188" Bottom="16"
NavigateUrl=" exposure" AlternateText=" National Exposure Service" />
<asp:RectangleH otSpot Left="203" Top="1" Right="323" Bottom="16"
NavigateUrl=" athletes" AlternateText=" Athlete Database" />
<asp:RectangleH otSpot Left="336" Top="1" Right="428" Bottom="16"
NavigateUrl=" tournaments" AlternateText=" Tournaments" />
<asp:RectangleH otSpot Left="442" Top="1" Right="555" Bottom="16"
NavigateUrl=" summercamps" AlternateText=" Summer Camps" />
<asp:RectangleH otSpot Left="569" Top="1" Right="659" Bottom="16"
NavigateUrl=" coaches" AlternateText=" For Coaches" />
<asp:RectangleH otSpot Left="673" Top="1" Right="858" Bottom="16"
NavigateUrl=" opportunities" AlternateText=" Employment Opportunities" />
<asp:RectangleH otSpot Left="873" Top="1" Right="917" Bottom="16"
NavigateUrl=" " AlternateText=" Home" />
</asp:ImageMap>
</td>
</tr>
</table>
The exact code that this renders is:
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center" style="margin:0 px;padding:0px; ">
<img id="titlebanner 1_mapBanner" src="images/top_banner.jpg"
usemap="#Imag eMaptitlebanner 1_mapBanner"
style="bord er-width:0px;heigh t:82px;width:10 00px;margin:0px ;padding:0px;"
/><map name="ImageMapt itlebanner1_map Banner">
<area shape="rect" coords="125,5,2 00,22" href="usercontr ols/about"
title="Abou t AFBE" alt="About AFBE" /><area shape="rect"
coords="206,5 ,347,22" href="usercontr ols/foundation" title="Foundati on
Scholarship " alt="Foundation Scholarship" /><area shape="rect"
coords="353,5 ,421,22" href="usercontr ols/contact.asp" title="Contact Us"
alt="Contac t Us" /><area shape="rect" coords="425,5,5 11,22"
href="usercon trols/affiliates" title="Affiliat e Login" alt="Affiliate
Login" /><area shape="rect" coords="857,37, 896,65" href=""
title="Englis h Version" alt="English Version" /><area shape="rect"
coords="902,3 7,940,65" href="usercontr ols/espanol" title="Spanish
Version" alt="Spanish Version" /><area shape="rect"
coords="946,3 7,984,65" href="usercontr ols/francis" title="French
Version" alt="French Version" />
</map>
<img id="titlebanner 1_mapNavBanner" src="images/navigation.jpg"
usemap="#Imag eMaptitlebanner 1_mapNavBanner"
style="bord er-width:0px;heigh t:19px;width:10 00px;margin:0px ;padding:0px;"
/><map name="ImageMapt itlebanner1_map NavBanner">
<area shape="rect" coords="7,1,188 ,16" href="usercontr ols/exposure"
title="Nation al Exposure Service" alt="National Exposure Service"
/><area shape="rect" coords="203,1,3 23,16" href="usercontr ols/athletes"
title="Athlet e Database" alt="Athlete Database" /><area shape="rect"
coords="336,1 ,428,16" href="usercontr ols/tournaments"
title="Tourna ments" alt="Tournament s" /><area shape="rect"
coords="442,1 ,555,16" href="usercontr ols/summercamps" title="Summer
Camps" alt="Summer Camps" /><area shape="rect" coords="569,1,6 59,16"
href="usercon trols/coaches" title="For Coaches" alt="For Coaches"
/><area shape="rect" coords="673,1,8 58,16"
href="usercon trols/opportunities" title="Employme nt Opportunities"
alt="Employme nt Opportunities" /><area shape="rect"
coords="873,1 ,917,16" href="" title="Home" alt="Home" />
</map>
</td>
</tr>
</table>
I don't know why it would help, but the two images are located at:

http://www.mosaicinc.net/clients/afb...top_banner.jpg
http://www.mosaicinc.net/clients/afb...navigation.jpg

The width & height that I specify in my code (1000x82 & 1000x19) are
correct, and I also tried not specifying a width & height, but neither
made any difference. The only working solution I have found is to write
the html by hand and place a <br/between the img & map tags. If you go
to:

http://www.mosaicinc.net/clients/afbe/

you can see the two imagemaps at the top without any empty space between
them. But if you look at the source code, you will notice that there is
a <brtag between the img and map tags (the page that is currently
there is written in Classic ASP, I need to convert it to ASP.NET, and I
would rather use the ImageMap control than manually write the html). If
there is any other information that might help you help me find a
solution, let me know. Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/

"clintonG" <cs*********@RE MOVETHISTEXTmet romilwaukee.com wrote in
message news:O$******** ******@TK2MSFTN GP04.phx.gbl...
What does the ImageMap control render in the html? A div of its own or
the tables you have been pasting into this news article? You might be
asked to put the images you are using on a server with a URL I or
others can look at before we could help any further.

<%= Clinton

"Nathan Sokalski" <nj********@hot mail.comwrote in message
news:e%***** ***********@TK2 MSFTNGP04.phx.g bl...
That didn't help either. I tried using the following tag layout:
>
<div style="margin:0 px;padding:0px; ">
<asp:ImageMap ID="mapBanner" runat="server" BorderWidth="0p x"
Height="82p x" ImageUrl="../images/top_banner.jpg" Width="1000px"
style="marg in:0px;padding: 0px;">
</asp:ImageMap>
</div>
<div style="margin:0 px;padding:0px; ">
<asp:ImageMap ID="mapNavBanne r" runat="server" Width="1000"
Height="1 9" BorderWidth="0" ImageUrl="../images/navigation.jpg"
style="marg in:0px;padding: 0px;">
</asp:ImageMap>
</div>
>
but the whitestrip still shows up between the ImageMaps. Any other
ideas? Thanks.
--
Nathan Sokalski
nj********@hotm ail.com
http://www.nathansokalski.com/
>
"clintonG " <cs*********@RE MOVETHISTEXTmet romilwaukee.com wrote in
message news:uI******** ******@TK2MSFTN GP04.phx.gbl...
>Try it the way I suggested. Get them out of the td and into divs of
>their own.
>>
><%= Clinton
>>
>"Nathan Sokalski" <nj********@hot mail.comwrote in message
>news:%2*** *************@T K2MSFTNGP03.phx .gbl...
>>>I have tried using CSS properties to control this, but it does not
>>>seem to help. Here is my actual code (I removed the
>>><asp:Rec tangleHotSpot/tags to shorten it):
>>>
>><table border="0" cellpadding="0" cellspacing="0" width="100%">
>> <tr>
>> <td align="center" style="margin:0 px;padding:0px; ">
>> <asp:ImageMap ID="mapBanner" runat="server"
>>BorderWid th="0px" Height="82px" ImageUrl="../images/top_banner.jpg"
>>Width="10 00px" style="margin:0 px;padding:0px; ">
>> </asp:ImageMap>
>> <asp:ImageMap ID="mapNavBanne r" runat="server"
>>Width="10 00" Height="19" BorderWidth="0"
>>ImageUrl= "../images/navigation.jpg" style="margin:0 px;padding:0px; ">
>> </asp:ImageMap>
>> </td>
>> </tr>
>></table>
>>>
>>I have also tried using two separate table rows, which did not help
>>either. Any other ideas? Thanks.
>>--
>>Nathan Sokalski
>>nj********@hotm ail.com
>>http://www.nathansokalski.com/
>>>
>>"clintonG " <cs*********@RE MOVETHISTEXTmet romilwaukee.com wrote in
>>message news:%2******** ********@TK2MSF TNGP03.phx.gbl. ..
>>>Put each control into a separate Panel or div and use styled
>>>margin s to manage white space.
>>>>
>>><%= Clinton Gallagher
>>> NET csgallagher AT metromilwaukee. com
>>> URL http://clintongallagher.metromilwaukee.com/
>>> MAP 43°2'17"N 88°2'37"W : 43°2'17"N 88°2'37"W
>>>>
>>>"Natha n Sokalski" <nj********@hot mail.comwrote in message
>>>news:OZ* *************@T K2MSFTNGP04.phx .gbl...
>>>>>I am using ASP.NET 2.0's ImageMap Control to create 2 imagemaps,
>>>>>one directly below the other. When I do this a thin blank space
>>>>>appear s between them. After several days of frustration I realized
>>>>>that the difference between what the ImageMap Control outputs and
>>>>>the html on the page I was trying to reproduce with ASP.NET 2.0 was
>>>>>the following:
>>>>>
>>>>>
>>>>Handwri tten HTML imagemaps (no whitestrip between them):
>>>>>
>>>><tabl e>
>>>> <tr>
>>>> <td>
>>>> <img/><br/>
>>>> <map>
>>>> <area/>
>>>> </map>
>>>> <img/><br/>
>>>> <map>
>>>> <area/>
>>>> </map>
>>>> </td>
>>>> </tr>
>>>></table>
>>>>>
>>>>ASP.N ET 2.0 generated HTML using the ImageMap Control (whitestrip
>>>>appea rs between the two ImageMaps):
>>>>>
>>>><tabl e>
>>>> <tr>
>>>> <td>
>>>> <img/>
>>>> <map>
>>>> <area/>
>>>> </map>
>>>> <img/>
>>>> <map>
>>>> <area/>
>>>> </map>
>>>> </td>
>>>> </tr>
>>>></table>
>>>>>
>>>>>
>>>>In case you didn't see it, the difference is that the handwritten
>>>>HTML includes a <br/between the <img/and <maptags. However,
>>>>this is not achievable (at least not using any technique I can
>>>>think of) using the ASP.NET 2.0 ImageMap Control. What can I do?
>>>>Thank s.
>>>>--
>>>>Natha n Sokalski
>>>>nj********@hotm ail.com
>>>>http://www.nathansokalski.com/
>>>>>
>>>>
>>>>
>>>
>>>
>>
>>
>
>




Sep 25 '06 #10

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

10
15702
by: Imran | last post by:
Hi, I am attempting to create a CSS-driven website, in that I want to be able to control the display/content from the CSS file. I do not want to use tables. On a page, I have a background image (that contains smaller images) and I would like to assign the smaller images as hyperlinks. What is the best way to do this? I know I can use an imagemap, but is
0
1286
by: Alan Wang | last post by:
Hi There, For asp.net 2.0, there is a new web control called imageMap. I am just wondering if there is ONLINE imageMap editor in the market so that programmer doesn't have to figure out the actual pixel coordinates of the corners of my hot spots and enter them numerically. Thanks in advanced
0
1583
by: Gilgamesh | last post by:
Hi, I have some very limited knowledge of web development but I have an imagemap in which I want to be able to display a small yellow circle at certain pre-define locations. When the user moves over these circles, I need to show a small pop-up with info regarding this label. Here is my Page_Load method: // These create the hotspots at predefined locations which I'll get
0
954
by: Eirik Eldorsen | last post by:
I've just tried out new new ImageMap control. It works great, but it was was really annoying that I had to write the coordinates manually. Is there a way to make the control render valid xhtml? The rendered code does not include the id attribute of the <map> tag, which is not valid. Example: <map name="ImageMapctl04_ImageMap1">
1
1413
by: Mad Scientist Jr | last post by:
I found some info on creating an imagemap in .NET at http://msconline.maconstate.edu/Tutorials/ASPNET2/ASPNET05/aspnet05-04.aspx but in VS.NET I don't see any ImageMap object under System.Web.UI.WebControls or any ImageMap control on the Web Forms toolbox (just Image and Image Button). If I try pasting code such as below, .NET does not recognize the
9
1650
by: Nathan Sokalski | last post by:
I am using ASP.NET 2.0's ImageMap Control to create 2 imagemaps, one directly below the other. When I do this a thin blank space appears between them. After several days of frustration I realized that the difference between what the ImageMap Control outputs and the html on the page I was trying to reproduce with ASP.NET 2.0 was the following: Handwritten HTML imagemaps (no whitestrip between them): <table>
1
2005
by: Jeff | last post by:
ASP.NET 2.0 I've got problems with the Width of the ImageMap below. The problem is that the ImageMap's Width doesn't have any effect in my GridView, the width are determine by width of the column and the with of the div (the div the ImageMap is included in). In the code below the column & div has Width of 300px and ImageMap has Width of 130, but when the page holding this GridView is displayed then the Width is 300 on the ImageMap. I...
0
1425
by: William Main | last post by:
I have the following code ImageMap image1 = new ImageMap(); image1.Click += new ImageMapEventHandler(ImageMap_Click); image1.HotSpotMode = HotSpotMode.PostBack; image1.ImageUrl = "~/images/permacon/page2.png"; if (Percentage != 100.0) { image1.Width = Unit.Percentage(Percentage); image1.Height = Unit.Percentage(Percentage);
1
1882
by: BillGatesFan | last post by:
Is there a way to change to swapimages for an imagemap in asp.net upon postback on the server? Thanks!
0
9423
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
0
10211
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
0
10045
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...
0
9863
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
0
8870
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
1
7408
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
5298
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
1
3958
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
2
3561
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.