Connecting Tech Pros Worldwide Help | Site Map
bytes > topic > asp .net > answers

White strip showing up between two imagemaps

Nathan Sokalski
Guest
  
Posts: n/a
#1: Sep 22 '06
I have two asp:ImageMaps in a table cell as follows:


<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr valign="top">
<td align="center">
<asp:ImageMap ID="mapBanner" runat="server" BorderWidth="0px"
Height="82px" ImageUrl="../images/top_banner.jpg" Width="1000px"
style="margin:0px;padding:0px;">
<asp:RectangleHotSpot Left="125" Top="5" Right="200" Bottom="22"
NavigateUrl="about" AlternateText="About AFBE" />
<asp:RectangleHotSpot Left="206" Top="5" Right="347" Bottom="22"
NavigateUrl="foundation" AlternateText="Foundation Scholarship" />
<asp:RectangleHotSpot Left="353" Top="5" Right="421" Bottom="22"
NavigateUrl="contact.asp" AlternateText="Contact Us" />
<asp:RectangleHotSpot Left="425" Top="5" Right="511" Bottom="22"
NavigateUrl="affiliates" AlternateText="Affiliate Login" />
<asp:RectangleHotSpot Left="857" Top="37" Right="896" Bottom="65"
NavigateUrl="" AlternateText="English Version" />
<asp:RectangleHotSpot Left="902" Top="37" Right="940" Bottom="65"
NavigateUrl="espanol" AlternateText="Spanish Version" />
<asp:RectangleHotSpot Left="946" Top="37" Right="984" Bottom="65"
NavigateUrl="francis" AlternateText="French Version" />
</asp:ImageMap>
<asp:ImageMap ID="mapNavBanner" runat="server" Width="1000" Height="19"
BorderWidth="0" ImageUrl="../images/navigation.jpg"
style="margin:0px;padding:0px;">
<asp:RectangleHotSpot Left="7" Top="1" Right="188" Bottom="16"
NavigateUrl="exposure" AlternateText="National Exposure Service" />
<asp:RectangleHotSpot Left="203" Top="1" Right="323" Bottom="16"
NavigateUrl="athletes" AlternateText="Athlete Database" />
<asp:RectangleHotSpot Left="336" Top="1" Right="428" Bottom="16"
NavigateUrl="tournaments" AlternateText="Tournaments" />
<asp:RectangleHotSpot Left="442" Top="1" Right="555" Bottom="16"
NavigateUrl="summercamps" AlternateText="Summer Camps" />
<asp:RectangleHotSpot Left="569" Top="1" Right="659" Bottom="16"
NavigateUrl="coaches" AlternateText="For Coaches" />
<asp:RectangleHotSpot Left="673" Top="1" Right="858" Bottom="16"
NavigateUrl="opportunities" AlternateText="Employment Opportunities" />
<asp:RectangleHotSpot Left="873" Top="1" Right="917" Bottom="16"
NavigateUrl="" AlternateText="Home" />
</asp:ImageMap>
</td>
</tr>
</table>


I would expect the top/bottom of these to be touching each other, but there
is a white strip of empty space between them. Why is this? Thanks.
--
Nathan Sokalski
njsokalski@hotmail.com
http://www.nathansokalski.com/
Baski
Guest
  
Posts: n/a
#2: Sep 22 '06

re: White strip showing up between two imagemaps

Remove all the height property and give it a shot.

"Nathan Sokalski" <njsokalski@hotmail.comwrote in message
news:Okfm92l3GHA.4932@TK2MSFTNGP02.phx.gbl...
Quote:
>I have two asp:ImageMaps in a table cell as follows:
>
>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr valign="top">
<td align="center">
<asp:ImageMap ID="mapBanner" runat="server" BorderWidth="0px"
Height="82px" ImageUrl="../images/top_banner.jpg" Width="1000px"
style="margin:0px;padding:0px;">
<asp:RectangleHotSpot Left="125" Top="5" Right="200" Bottom="22"
NavigateUrl="about" AlternateText="About AFBE" />
<asp:RectangleHotSpot Left="206" Top="5" Right="347" Bottom="22"
NavigateUrl="foundation" AlternateText="Foundation Scholarship" />
<asp:RectangleHotSpot Left="353" Top="5" Right="421" Bottom="22"
NavigateUrl="contact.asp" AlternateText="Contact Us" />
<asp:RectangleHotSpot Left="425" Top="5" Right="511" Bottom="22"
NavigateUrl="affiliates" AlternateText="Affiliate Login" />
<asp:RectangleHotSpot Left="857" Top="37" Right="896" Bottom="65"
NavigateUrl="" AlternateText="English Version" />
<asp:RectangleHotSpot Left="902" Top="37" Right="940" Bottom="65"
NavigateUrl="espanol" AlternateText="Spanish Version" />
<asp:RectangleHotSpot Left="946" Top="37" Right="984" Bottom="65"
NavigateUrl="francis" AlternateText="French Version" />
</asp:ImageMap>
<asp:ImageMap ID="mapNavBanner" runat="server" Width="1000" Height="19"
BorderWidth="0" ImageUrl="../images/navigation.jpg"
style="margin:0px;padding:0px;">
<asp:RectangleHotSpot Left="7" Top="1" Right="188" Bottom="16"
NavigateUrl="exposure" AlternateText="National Exposure Service" />
<asp:RectangleHotSpot Left="203" Top="1" Right="323" Bottom="16"
NavigateUrl="athletes" AlternateText="Athlete Database" />
<asp:RectangleHotSpot Left="336" Top="1" Right="428" Bottom="16"
NavigateUrl="tournaments" AlternateText="Tournaments" />
<asp:RectangleHotSpot Left="442" Top="1" Right="555" Bottom="16"
NavigateUrl="summercamps" AlternateText="Summer Camps" />
<asp:RectangleHotSpot Left="569" Top="1" Right="659" Bottom="16"
NavigateUrl="coaches" AlternateText="For Coaches" />
<asp:RectangleHotSpot Left="673" Top="1" Right="858" Bottom="16"
NavigateUrl="opportunities" AlternateText="Employment Opportunities" />
<asp:RectangleHotSpot Left="873" Top="1" Right="917" Bottom="16"
NavigateUrl="" AlternateText="Home" />
</asp:ImageMap>
</td>
</tr>
</table>
>
>
I would expect the top/bottom of these to be touching each other, but
there is a white strip of empty space between them. Why is this? Thanks.
--
Nathan Sokalski
njsokalski@hotmail.com
http://www.nathansokalski.com/
>

Nathan Sokalski
Guest
  
Posts: n/a
#3: Sep 22 '06

re: White strip showing up between two imagemaps

That did not make any difference. Any other ideas? Thanks.
--
Nathan Sokalski
njsokalski@hotmail.com
http://www.nathansokalski.com/

"Baski" <baski@aldensys.comwrote in message
news:OdxM5%23m3GHA.4364@TK2MSFTNGP06.phx.gbl...
Quote:
Remove all the height property and give it a shot.
>
"Nathan Sokalski" <njsokalski@hotmail.comwrote in message
news:Okfm92l3GHA.4932@TK2MSFTNGP02.phx.gbl...
Quote:
>>I have two asp:ImageMaps in a table cell as follows:
>>
>>
><table border="0" cellpadding="0" cellspacing="0" width="100%">
><tr valign="top">
> <td align="center">
> <asp:ImageMap ID="mapBanner" runat="server" BorderWidth="0px"
>Height="82px" ImageUrl="../images/top_banner.jpg" Width="1000px"
>style="margin:0px;padding:0px;">
> <asp:RectangleHotSpot Left="125" Top="5" Right="200" Bottom="22"
>NavigateUrl="about" AlternateText="About AFBE" />
> <asp:RectangleHotSpot Left="206" Top="5" Right="347" Bottom="22"
>NavigateUrl="foundation" AlternateText="Foundation Scholarship" />
> <asp:RectangleHotSpot Left="353" Top="5" Right="421" Bottom="22"
>NavigateUrl="contact.asp" AlternateText="Contact Us" />
> <asp:RectangleHotSpot Left="425" Top="5" Right="511" Bottom="22"
>NavigateUrl="affiliates" AlternateText="Affiliate Login" />
> <asp:RectangleHotSpot Left="857" Top="37" Right="896" Bottom="65"
>NavigateUrl="" AlternateText="English Version" />
> <asp:RectangleHotSpot Left="902" Top="37" Right="940" Bottom="65"
>NavigateUrl="espanol" AlternateText="Spanish Version" />
> <asp:RectangleHotSpot Left="946" Top="37" Right="984" Bottom="65"
>NavigateUrl="francis" AlternateText="French Version" />
> </asp:ImageMap>
> <asp:ImageMap ID="mapNavBanner" runat="server" Width="1000" Height="19"
>BorderWidth="0" ImageUrl="../images/navigation.jpg"
>style="margin:0px;padding:0px;">
> <asp:RectangleHotSpot Left="7" Top="1" Right="188" Bottom="16"
>NavigateUrl="exposure" AlternateText="National Exposure Service" />
> <asp:RectangleHotSpot Left="203" Top="1" Right="323" Bottom="16"
>NavigateUrl="athletes" AlternateText="Athlete Database" />
> <asp:RectangleHotSpot Left="336" Top="1" Right="428" Bottom="16"
>NavigateUrl="tournaments" AlternateText="Tournaments" />
> <asp:RectangleHotSpot Left="442" Top="1" Right="555" Bottom="16"
>NavigateUrl="summercamps" AlternateText="Summer Camps" />
> <asp:RectangleHotSpot Left="569" Top="1" Right="659" Bottom="16"
>NavigateUrl="coaches" AlternateText="For Coaches" />
> <asp:RectangleHotSpot Left="673" Top="1" Right="858" Bottom="16"
>NavigateUrl="opportunities" AlternateText="Employment Opportunities" />
> <asp:RectangleHotSpot Left="873" Top="1" Right="917" Bottom="16"
>NavigateUrl="" AlternateText="Home" />
> </asp:ImageMap>
> </td>
></tr>
></table>
>>
>>
>I would expect the top/bottom of these to be touching each other, but
>there is a white strip of empty space between them. Why is this? Thanks.
>--
>Nathan Sokalski
>njsokalski@hotmail.com
>http://www.nathansokalski.com/
>>
>
>

Baski
Guest
  
Posts: n/a
#4: Sep 22 '06

re: White strip showing up between two imagemaps

Put each images in it's own row instead of one row. Set top rows valign to
bottom and bottom rows valign to top and see what happens.

"Nathan Sokalski" <njsokalski@hotmail.comwrote in message
news:e4SF6xn3GHA.3656@TK2MSFTNGP04.phx.gbl...
Quote:
That did not make any difference. Any other ideas? Thanks.
--
Nathan Sokalski
njsokalski@hotmail.com
http://www.nathansokalski.com/
>
"Baski" <baski@aldensys.comwrote in message
news:OdxM5%23m3GHA.4364@TK2MSFTNGP06.phx.gbl...
Quote:
>Remove all the height property and give it a shot.
>>
>"Nathan Sokalski" <njsokalski@hotmail.comwrote in message
>news:Okfm92l3GHA.4932@TK2MSFTNGP02.phx.gbl...
Quote:
>>>I have two asp:ImageMaps in a table cell as follows:
>>>
>>>
>><table border="0" cellpadding="0" cellspacing="0" width="100%">
>><tr valign="top">
>> <td align="center">
>> <asp:ImageMap ID="mapBanner" runat="server" BorderWidth="0px"
>>Height="82px" ImageUrl="../images/top_banner.jpg" Width="1000px"
>>style="margin:0px;padding:0px;">
>> <asp:RectangleHotSpot Left="125" Top="5" Right="200" Bottom="22"
>>NavigateUrl="about" AlternateText="About AFBE" />
>> <asp:RectangleHotSpot Left="206" Top="5" Right="347" Bottom="22"
>>NavigateUrl="foundation" AlternateText="Foundation Scholarship" />
>> <asp:RectangleHotSpot Left="353" Top="5" Right="421" Bottom="22"
>>NavigateUrl="contact.asp" AlternateText="Contact Us" />
>> <asp:RectangleHotSpot Left="425" Top="5" Right="511" Bottom="22"
>>NavigateUrl="affiliates" AlternateText="Affiliate Login" />
>> <asp:RectangleHotSpot Left="857" Top="37" Right="896" Bottom="65"
>>NavigateUrl="" AlternateText="English Version" />
>> <asp:RectangleHotSpot Left="902" Top="37" Right="940" Bottom="65"
>>NavigateUrl="espanol" AlternateText="Spanish Version" />
>> <asp:RectangleHotSpot Left="946" Top="37" Right="984" Bottom="65"
>>NavigateUrl="francis" AlternateText="French Version" />
>> </asp:ImageMap>
>> <asp:ImageMap ID="mapNavBanner" runat="server" Width="1000"
>>Height="19" BorderWidth="0" ImageUrl="../images/navigation.jpg"
>>style="margin:0px;padding:0px;">
>> <asp:RectangleHotSpot Left="7" Top="1" Right="188" Bottom="16"
>>NavigateUrl="exposure" AlternateText="National Exposure Service" />
>> <asp:RectangleHotSpot Left="203" Top="1" Right="323" Bottom="16"
>>NavigateUrl="athletes" AlternateText="Athlete Database" />
>> <asp:RectangleHotSpot Left="336" Top="1" Right="428" Bottom="16"
>>NavigateUrl="tournaments" AlternateText="Tournaments" />
>> <asp:RectangleHotSpot Left="442" Top="1" Right="555" Bottom="16"
>>NavigateUrl="summercamps" AlternateText="Summer Camps" />
>> <asp:RectangleHotSpot Left="569" Top="1" Right="659" Bottom="16"
>>NavigateUrl="coaches" AlternateText="For Coaches" />
>> <asp:RectangleHotSpot Left="673" Top="1" Right="858" Bottom="16"
>>NavigateUrl="opportunities" AlternateText="Employment Opportunities" />
>> <asp:RectangleHotSpot Left="873" Top="1" Right="917" Bottom="16"
>>NavigateUrl="" AlternateText="Home" />
>> </asp:ImageMap>
>> </td>
>></tr>
>></table>
>>>
>>>
>>I would expect the top/bottom of these to be touching each other, but
>>there is a white strip of empty space between them. Why is this? Thanks.
>>--
>>Nathan Sokalski
>>njsokalski@hotmail.com
>>http://www.nathansokalski.com/
>>>
>>
>>
>
>

Nathan Sokalski
Guest
  
Posts: n/a
#5: Sep 23 '06

re: White strip showing up between two imagemaps

That did not make any difference either. After experimenting with some code
in a *.html file to find something that works, I found that a <br/needs to
be output between the <imgand <maptags, so my output needs to be the
following tags to avoid the white strip:


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


However, this presents the problem of how to get ASP.NET to output the <br/>
tag. Because the <br/tag must be between the <img/and <maptags and
<asp:ImageMapcan only contain certain tags, I cannot figure out how to get
the <br/in the right place. What do I do? Thanks.
--
Nathan Sokalski
njsokalski@hotmail.com
http://www.nathansokalski.com/

"Baski" <baski@aldensys.comwrote in message
news:%238G9g6n3GHA.4024@TK2MSFTNGP03.phx.gbl...
Quote:
Put each images in it's own row instead of one row. Set top rows valign to
bottom and bottom rows valign to top and see what happens.
>
"Nathan Sokalski" <njsokalski@hotmail.comwrote in message
news:e4SF6xn3GHA.3656@TK2MSFTNGP04.phx.gbl...
Quote:
>That did not make any difference. Any other ideas? Thanks.
>--
>Nathan Sokalski
>njsokalski@hotmail.com
>http://www.nathansokalski.com/
>>
>"Baski" <baski@aldensys.comwrote in message
>news:OdxM5%23m3GHA.4364@TK2MSFTNGP06.phx.gbl...
Quote:
>>Remove all the height property and give it a shot.
>>>
>>"Nathan Sokalski" <njsokalski@hotmail.comwrote in message
>>news:Okfm92l3GHA.4932@TK2MSFTNGP02.phx.gbl...
>>>>I have two asp:ImageMaps in a table cell as follows:
>>>>
>>>>
>>><table border="0" cellpadding="0" cellspacing="0" width="100%">
>>><tr valign="top">
>>> <td align="center">
>>> <asp:ImageMap ID="mapBanner" runat="server" BorderWidth="0px"
>>>Height="82px" ImageUrl="../images/top_banner.jpg" Width="1000px"
>>>style="margin:0px;padding:0px;">
>>> <asp:RectangleHotSpot Left="125" Top="5" Right="200" Bottom="22"
>>>NavigateUrl="about" AlternateText="About AFBE" />
>>> <asp:RectangleHotSpot Left="206" Top="5" Right="347" Bottom="22"
>>>NavigateUrl="foundation" AlternateText="Foundation Scholarship" />
>>> <asp:RectangleHotSpot Left="353" Top="5" Right="421" Bottom="22"
>>>NavigateUrl="contact.asp" AlternateText="Contact Us" />
>>> <asp:RectangleHotSpot Left="425" Top="5" Right="511" Bottom="22"
>>>NavigateUrl="affiliates" AlternateText="Affiliate Login" />
>>> <asp:RectangleHotSpot Left="857" Top="37" Right="896" Bottom="65"
>>>NavigateUrl="" AlternateText="English Version" />
>>> <asp:RectangleHotSpot Left="902" Top="37" Right="940" Bottom="65"
>>>NavigateUrl="espanol" AlternateText="Spanish Version" />
>>> <asp:RectangleHotSpot Left="946" Top="37" Right="984" Bottom="65"
>>>NavigateUrl="francis" AlternateText="French Version" />
>>> </asp:ImageMap>
>>> <asp:ImageMap ID="mapNavBanner" runat="server" Width="1000"
>>>Height="19" BorderWidth="0" ImageUrl="../images/navigation.jpg"
>>>style="margin:0px;padding:0px;">
>>> <asp:RectangleHotSpot Left="7" Top="1" Right="188" Bottom="16"
>>>NavigateUrl="exposure" AlternateText="National Exposure Service" />
>>> <asp:RectangleHotSpot Left="203" Top="1" Right="323" Bottom="16"
>>>NavigateUrl="athletes" AlternateText="Athlete Database" />
>>> <asp:RectangleHotSpot Left="336" Top="1" Right="428" Bottom="16"
>>>NavigateUrl="tournaments" AlternateText="Tournaments" />
>>> <asp:RectangleHotSpot Left="442" Top="1" Right="555" Bottom="16"
>>>NavigateUrl="summercamps" AlternateText="Summer Camps" />
>>> <asp:RectangleHotSpot Left="569" Top="1" Right="659" Bottom="16"
>>>NavigateUrl="coaches" AlternateText="For Coaches" />
>>> <asp:RectangleHotSpot Left="673" Top="1" Right="858" Bottom="16"
>>>NavigateUrl="opportunities" AlternateText="Employment Opportunities" />
>>> <asp:RectangleHotSpot Left="873" Top="1" Right="917" Bottom="16"
>>>NavigateUrl="" AlternateText="Home" />
>>> </asp:ImageMap>
>>> </td>
>>></tr>
>>></table>
>>>>
>>>>
>>>I would expect the top/bottom of these to be touching each other, but
>>>there is a white strip of empty space between them. Why is this?
>>>Thanks.
>>>--
>>>Nathan Sokalski
>>>njsokalski@hotmail.com
>>>http://www.nathansokalski.com/
>>>>
>>>
>>>
>>
>>
>
>

Closed Thread

« previous question | next question »

Similar ASP.NET bytes

/bytes/development

/bytes/it

/bytes/about

We are a network of experts and professionals in IT and software development that help one another with answers to tough questions and share insights. Get the best answers to your questions from over 226,295 network members.

dev questions:
algorithms | asp | asp.net | c/c++ | coldfusion | c# | flash | html/css | java | javascript |
mobile dev | .net | perl | php | python | ruby | software dev | vb.net | visual basic | xml
it questions:
access | apache | careers | db2 | iis | macosx | mysql | networking | oracle | postgresql | sql server | unix | windows

About Bytes | Copyright 1995-2009 BYTES. All rights Reserved