Can you style MAP and/or AREA tags?

I am NOT trying to build an image map. I am merely curious if i could add stile attribute to an img map using CSS… it seems rules are allowed but have no visual effect.

for example:
area { border:3px solid #fff}
or
map{background:#fff}

just curious if it can be done or not…

Hi, you can style them, it just takes a little bigger values in order for it to happen.

(Yes I’m going to use w3schools)

If you try giving the map a border, the minimum it takes to show a border is 3px (3px solid red for example)

I don’t think backgrounds will show though (why would you want to have a background color appear over your images?) :slight_smile:

hmmm… I dont see the borders appearing on the MAP or AREA (oly the “standard” link image border…:confused:

as far as covering up an image… that COULD have it’s uses…

I stand corrected, apparently the map is displayed ADJACENT to the image… :confused: with 0 for width and height unless I add “display:block;” which of course gives it height, but places it BELOW the image.

nothing I do makes the areas show up…

Yeah I guess trying to style this element is pretty useless…

You may not be able to see it but yes it can be styled. It’s just difficult because of the way the tag is :slight_smile:

[edit]Yup you got it :).

Just style a containing element, aka a <div> surrounding it[/edit]

Hi,

You can style them but like other special elements they are usually display:none to start with.

e.g.

Firefox has these as default in html.css


area, base, basefont, head, meta, script, style, title,
noembed, param {
   display: none;
}

If you set it to display:block you can give it a background and borders etc.

However, as you noticed the element doesn’t actually sit in the place specified by the co-ordinate attributes. The element is probably just a container for holding data that the browser can use to identify the relevant parts.