Preventing sliced graphics from moving in reduced browser?

Hello everyone,
Is there html code that will prevent a sliced graphic from moving in on itself when the browser is reduced in size? Someone suggested I use a <div></div> but that didn’t work. Maybe I should put them in a table?
I am doing this in Joomla for my boss.
Thanks for your help. :smile:
Here is the code I used.

<p><map name="Map"> </map><img src="images/TestingLinkBannertest.gif" border="0" width="280" height="102" style="border: 0;" /><a href="" target="_blank"><img src="images/TestingLinkBanner-link1.gif" border="0" width="92" height="102" style="border: 0;" /></a><a href="" target="_blank"><img src="images/TestingLinkBanner-link2.gif" border="0" width="92" height="102" style="border: 0;" /></a><map id="Map" name="Map"> 
<area shape="rect" coords="332,11,391,97" href="" alt="linktoJoomla" target="_blank" />

I just tried a Table and it seems to DO THE TRICK. :smiley:

I’m not sure I’m correctly picturing what you’re trying to do here, but please don’t use a table except to contain tabular data.

If you need to use a table-style layout, then you can use display: table and related CSS properties.

1 Like

As @technobear says, using tables to do what you want is not semantic and it is not the right way to do it.
Use CSS instead.
display: table in small doses is the way to go

1 Like

Sounds like all you wanted was a width on the div to match the combined with of the sliced images to stop them wrapping.

1 Like

Yes that’s what I wanted. So the days of Tables are over?
I have to learn the div code it doesn’t wrap.

For layout, they were over a long, long time ago. For tabular data (which is why they were created for) they’re a must :slight_smile:


This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.