One page on my website consists of a single large image (with absolute position and fixed width) and an imagemap. I just realized that if i shrink my browser window or try to view the page on any screen that's not the same size as mine, the image and map become desynchronized.

I don't think this would be a problem if i could make the imagemap use percentage or vw/vh units instead of pixels, but it doesn't seem to work that way. It will accept percentages or vw/vh for one of a rectangular hotspot's coordinates, even mixed, but apparently one coordinate has to be in pixels.

Does anyone know a way around this besides letting the image be bigger than the window it's in and making users with smaller screens scroll horizontally?

I'm mostly concerned with compatibility with Firefox v138, but more generally compatible solutions are better.

If it helps, the relevant code for the image is:

style="position:absolute; top:0vh; left:0vw; width:100%"

and the map is:

<map name="map"> <area shape="rect" coords="89,522,173,634" title="font compryption" href="inventions/compryption.htm"> </map> A normal imagemap, as far as i can tell.

My website's home page is meant to look like a star system, with a sun in the middle and planets (links to parts of the site) orbiting around it. That's how it is currently (here, scroll down and right a little).

What i'm struggling with now is making moons that can orbit planets orbiting the sun. I've tried moving a planet's inline CSS into a element around that planet's link and picture, and then adding another planet to that , but i can't figure out how to make it orbit around the parent planet instead of around the sun.

I did see this Codepen example, but it works differently from how the rest of my orbits are set up. It seems to rotate planets from an offset center, rather than moving them on a circular path without rotating them. And i couldn't figure out how to adapt its moon movement to my page.

Is there a good way to do what i'm trying to do, besides rewriting my page to work like the Codepen one? Thanks in advance.

I don't expect it to be possible, but it could be interesting to have different imagemaps for different frames of a gif or other animated image. For example, a large slowly spinning globe, that lets you click continents to go to more information about them. Is there a way to do this?

My site is currently pretty simple, but it still uses enough CSS that some parts of it look really bad in a browser like Links2 that doesn't support CSS. Most of what i'm doing with CSS can be done with plain HTML, it just doesn't look as good.

Is there a way to make a page try to load normally with CSS and whatnot, and then only load a simpler version with everything done in tables if the normal version can't load? Is my best option here to make normal and simple versions of every page?

Most of the links in my website (i haven't gotten around to all of them yet) have the size of the page they link to as a title, so you can see how big the page will be before you click the link. Is there an easy way to generate new titles for all my links based on what they link to, instead of doing it manually? Even better if it can include embedded files like images in the size preview.

I currently just edit my code in xed, my computer's built in text editor. I haven't looked into dedicated HTML editors yet, but i'd be open to trying one (that runs on Linux) if it can do this.

Thanks in advance.

Right now, I would like a easy editor that allows me to not worry about HTML4 syntax, and simply adjust the rendered text, while I can see the HTML source code.

The reason I need something like this is that I sometimes do make note() in G'MIC which looks like this:

#@gui:_=separator(),_=note("<center><b>- Additional Information -</b></center>")

See that inside note("")? That's HTML4. And while I can do without a editor, I feel that it would be better to use an actual editor where I can copy and paste.

My code can look something like this (Without wrap lines):

<b>Palette CLI Information</b>\n\n <i>Main Source of Palettes - </i><a href=\"https://lospec.com/palette-list/"> LoSpec Palette List</a>\n\nPalette Number -- pal number_id = pal name_id -- Full Palette Name by Author[if mentioned]\n\n1 -- +pal 0 = +pal bw -- Black & White\n2 -- +pal 1 = +pal rgb -- Red-Green-Blue\n3 -- +pal 2 = +pal b_rgb -- Black with Red-Green-Blue\n4 -- +pal 3 = +pal bw_rgb -- Black & White with Red-Green-Blue\n5 -- +pal 4 = +pal cmy -- Cyan-Magenta-Yellow\n6 -- +pal 5 = +pal cmyk -- Cyan-Magenta-Yellow-Black\n7 -- +pal 6 = +pal w_cmyk -- White-Cyan-Magenta-Yellow-Black\n8 -- +pal 7 = +pal rgbcmy -- Red-Green-Blue with Cyan-Magenta-Yellow\n9 -- +pal 8 = +pal 1bitrgb -- 1-Bit RGB\n10 -- +pal 9 = +pal aurora -- Aurora by GrafxKid\n11 -- +pal 10 = +pal zenit -- Zenit-241 by Zenit40\n12 -- +pal 11 = +pal gbg -- Game Builder Garage: Texture-Sprite Editor Palette\n13 -- +pal 12 = +pal duel -- Duel by Arilyn\n14 -- +pal 13 = +pal hocuspocus -- Hocus Pocus Palette by Apogee Software,Ltd.\n15 -- +pal 14 = +pal playpal -- PLAYPAL by id Tech 1 | DOOM Engine\n16 -- +pal 15 = +pal srb2 -- Sonic Robo Blast 2\n17 -- +pal 16 = +pal uzebox -- Uzebox from Uzebox console\n18 -- +pal 17 = +pal kens16 -- Andrew Kensler - 16 by Andrew Kensler\n19 -- +pal 18 = +pal kens32 -- Andrew Kensler - 32 by Andrew Kensler\n20 -- +pal 19 = +pal kens54 -- Andrew Kensler - 54 by Andrew Kensler\n21 -- +pal 20 = +pal aap12 -- AAP-Micro 12 by Adigun A. Polack\n22 -- +pal 21 = +pal aap16 -- AAP-16 by Adigun A. Polack\n23 -- +pal 22 = +pal aap64 -- AAP-64 by Adigun A. Polack

Russian website!

cross-posted from: https://programming.dev/post/6852589

Not OC

Hi,

I would like to display an element (div) of another web page, hosted on a owned sub domain..

I was planning to use iframe, but it seem that iframe only allow to grab the entire page... any ideas ?

Thanks.

This is my favorite new feature in HTML. It allows us to define custom HTML elements as classes and talk to them using attributes.