HTML - Position image x,y in html

11-04-2009, 02:20 PM

Hi,

We have a monitoring page on a specific computer where we need some
differently sized images accurately positioned. Hence there is no
compatibility issues. One computer, one browser.

How do we place imageA.gif at x=500 Y=200? (from the upper left corner
of the screen) At its native pixel size.

Thanks for tips on this

regards

geir

Geir

11-04-2009, 02:55 PM

Gazing into my crystal ball I observed Geir <> writing
in news::

> Hi,
>
> We have a monitoring page on a specific computer where we need some
> differently sized images accurately positioned. Hence there is no
> compatibility issues. One computer, one browser.
>
> How do we place imageA.gif at x=500 Y=200? (from the upper left corner
> of the screen) At its native pixel size.
>
> Thanks for tips on this
>
> regards
>
> geir
>

Look at the CSS position property.

--
Adrienne Boswell at Home
Arbpen Web Site Design Services
http://www.cavalcade-of-coding.info
Please respond to the group so others can share

Adrienne Boswell

11-04-2009, 09:28 PM

"Geir" <> wrote in message
news:...
> Hi,
>
> We have a monitoring page on a specific computer where we need some
> differently sized images accurately positioned. Hence there is no
> compatibility issues. One computer, one browser.
>
> How do we place imageA.gif at x=500 Y=200? (from the upper left corner of
> the screen) At its native pixel size.
>
> Thanks for tips on this

<!DOCTYPE HTML>
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>Position imageA</title>
<style type="text/css">
.imageA {
position: absolute;
left: 500px;
top: 200px;
}
</style>
</head>
<body>
<img src="imageA.gif" class="imageA" alt="meaningful alt text">
</body>
</html>

Nik Coughlin

11-05-2009, 10:55 PM

"Ben C" <> wrote in message
news:...
> On 2009-11-04, Nik Coughlin <> wrote:
>> "Geir" <> wrote in message
>> news:...
>>> Hi,
>>>
>>> We have a monitoring page on a specific computer where we need some
>>> differently sized images accurately positioned. Hence there is no
>>> compatibility issues. One computer, one browser.
>>>
>>> How do we place imageA.gif at x=500 Y=200? (from the upper left corner
>>> of
>>> the screen) At its native pixel size.
>>>
>>> Thanks for tips on this
>>
>><!DOCTYPE HTML>
>><html>
>> <head>
>> <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
>> <title>Position imageA</title>
>> <style type="text/css">
>> .imageA {
>> position: absolute;
>> left: 500px;
>> top: 200px;
>> }
>> </style>
>> </head>
>> <body>
>> <img src="imageA.gif" class="imageA" alt="meaningful alt text">
>> </body>
>></html>
>
> Yes, although this is invalid-- not supposed to have an IMG just inside
> BODY like that. Put a DIV around it.

Nope, perfectly valid, look at the doctype. But your advice is good for the
OP who is probably not authoring as HTML 5

Nik Coughlin

11-05-2009, 11:00 PM

"Nik Coughlin" <> wrote in message
news:hcvl58$446$...
> "Ben C" <> wrote in message
> news:...
>> On 2009-11-04, Nik Coughlin <> wrote:
>>>
>>><!DOCTYPE HTML>
>>><html>
>>> <head>
>>> <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
>>> <title>Position imageA</title>
>>> <style type="text/css">
>>> .imageA {
>>> position: absolute;
>>> left: 500px;
>>> top: 200px;
>>> }
>>> </style>
>>> </head>
>>> <body>
>>> <img src="imageA.gif" class="imageA" alt="meaningful alt text">
>>> </body>
>>></html>
>>
>> Yes, although this is invalid-- not supposed to have an IMG just inside
>> BODY like that. Put a DIV around it.
>
> Nope, perfectly valid, look at the doctype. But your advice is good for
> the OP who is probably not authoring as HTML 5

In fact, this is valid HTML5 (provided that the server is sending character
encoding or the file has a Unicode BOM):

<!DOCTYPE HTML>
<title>Position imageA</title>
<style type="text/css">
.imageA {
position: absolute;
left: 500px;
top: 200px;
}
</style>
<img src="bigger.png" class="imageA" alt="meantingful alt text">

Nik Coughlin

11-05-2009, 11:09 PM

On Nov 4, 9:20*am, Geir <gei...@gmail.com> wrote:
> ...Hence there is no
> compatibility issues. *One computer, one browser.

> How do we place imageA.gif at x=500 Y=200? (from the upper left corner
> of the screen) *At its native pixel size.

Does anyone "really" believe this is running this on a single system
with a single browser? Come on... They just know everyone will give
them crap about trying to make it look exactly like they want if they
did not put that in there...

That said, I think it is perfectly all right to have such a page and
they should look at CSS absolute positioning....

Travis Newbury

11-06-2009, 12:51 PM

Ben C wrote:

> On 2009-11-05, Nik Coughlin <> wrote:
>>>> <!DOCTYPE HTML>
>>>> <html> ...
>>>
>>> Yes, although this is invalid-- not supposed to have an IMG just
>>> inside BODY like that. Put a DIV around it.
>>
>> Nope, perfectly valid, look at the doctype. But your advice is good
>> for the OP who is probably not authoring as HTML 5

>
> I was curious about the doctype. So that's an HTML 5 doctype?

Sending Nik's sample to the validator produces this:

" Using experimental feature: HTML5 Conformance Checker.

The validator checked your document with an experimental feature: HTML5
Conformance Checker. This feature has been made available for your
convenience, but be aware that it may be unreliable, or not perfectly up
to date with the latest development of some cutting-edge technologies."

Personally, I wouldn't use HTML5 until it is listed here:
http://www.w3.org/QA/2002/04/valid-dtd-list.html

--
-bts
-but that's just me...

Beauregard T. Shagnasty

11-04-2009, 02:55 PM	#2
Adrienne Boswell Posts: n/a	Re: Position image x,y in html Gazing into my crystal ball I observed Geir <> writing in news:: > Hi, > > We have a monitoring page on a specific computer where we need some > differently sized images accurately positioned. Hence there is no > compatibility issues. One computer, one browser. > > How do we place imageA.gif at x=500 Y=200? (from the upper left corner > of the screen) At its native pixel size. > > Thanks for tips on this > > regards > > geir > Look at the CSS position property. -- Adrienne Boswell at Home Arbpen Web Site Design Services http://www.cavalcade-of-coding.info Please respond to the group so others can share Adrienne Boswell

11-04-2009, 09:28 PM	#3
Nik Coughlin Posts: n/a	Re: Position image x,y in html "Geir" <> wrote in message news:... > Hi, > > We have a monitoring page on a specific computer where we need some > differently sized images accurately positioned. Hence there is no > compatibility issues. One computer, one browser. > > How do we place imageA.gif at x=500 Y=200? (from the upper left corner of > the screen) At its native pixel size. > > Thanks for tips on this <!DOCTYPE HTML> <html> <head> <meta content="text/html; charset=utf-8" http-equiv="Content-Type"> <title>Position imageA</title> <style type="text/css"> .imageA { position: absolute; left: 500px; top: 200px; } </style> </head> <body> <img src="imageA.gif" class="imageA" alt="meaningful alt text"> </body> </html> Nik Coughlin

11-05-2009, 10:55 PM	#4
Nik Coughlin Posts: n/a	Re: Position image x,y in html "Ben C" <> wrote in message news:... > On 2009-11-04, Nik Coughlin <> wrote: >> "Geir" <> wrote in message >> news:... >>> Hi, >>> >>> We have a monitoring page on a specific computer where we need some >>> differently sized images accurately positioned. Hence there is no >>> compatibility issues. One computer, one browser. >>> >>> How do we place imageA.gif at x=500 Y=200? (from the upper left corner >>> of >>> the screen) At its native pixel size. >>> >>> Thanks for tips on this >> >><!DOCTYPE HTML> >><html> >> <head> >> <meta content="text/html; charset=utf-8" http-equiv="Content-Type"> >> <title>Position imageA</title> >> <style type="text/css"> >> .imageA { >> position: absolute; >> left: 500px; >> top: 200px; >> } >> </style> >> </head> >> <body> >> <img src="imageA.gif" class="imageA" alt="meaningful alt text"> >> </body> >></html> > > Yes, although this is invalid-- not supposed to have an IMG just inside > BODY like that. Put a DIV around it. Nope, perfectly valid, look at the doctype. But your advice is good for the OP who is probably not authoring as HTML 5 Nik Coughlin

11-05-2009, 11:00 PM	#5
Nik Coughlin Posts: n/a	Re: Position image x,y in html "Nik Coughlin" <> wrote in message news:hcvl58$446$... > "Ben C" <> wrote in message > news:... >> On 2009-11-04, Nik Coughlin <> wrote: >>> >>><!DOCTYPE HTML> >>><html> >>> <head> >>> <meta content="text/html; charset=utf-8" http-equiv="Content-Type"> >>> <title>Position imageA</title> >>> <style type="text/css"> >>> .imageA { >>> position: absolute; >>> left: 500px; >>> top: 200px; >>> } >>> </style> >>> </head> >>> <body> >>> <img src="imageA.gif" class="imageA" alt="meaningful alt text"> >>> </body> >>></html> >> >> Yes, although this is invalid-- not supposed to have an IMG just inside >> BODY like that. Put a DIV around it. > > Nope, perfectly valid, look at the doctype. But your advice is good for > the OP who is probably not authoring as HTML 5 In fact, this is valid HTML5 (provided that the server is sending character encoding or the file has a Unicode BOM): <!DOCTYPE HTML> <title>Position imageA</title> <style type="text/css"> .imageA { position: absolute; left: 500px; top: 200px; } </style> <img src="bigger.png" class="imageA" alt="meantingful alt text"> Nik Coughlin

11-05-2009, 11:09 PM	#6
Travis Newbury Posts: n/a	Re: Position image x,y in html On Nov 4, 9:20am, Geir <gei...@gmail.com> wrote: > ...Hence there is no > compatibility issues. One computer, one browser. > How do we place imageA.gif at x=500 Y=200? (from the upper left corner > of the screen) *At its native pixel size. Does anyone "really" believe this is running this on a single system with a single browser? Come on... They just know everyone will give them crap about trying to make it look exactly like they want if they did not put that in there... That said, I think it is perfectly all right to have such a page and they should look at CSS absolute positioning.... Travis Newbury

11-04-2009, 02:20 PM	#1
	Position image x,y in html Hi, We have a monitoring page on a specific computer where we need some differently sized images accurately positioned. Hence there is no compatibility issues. One computer, one browser. How do we place imageA.gif at x=500 Y=200? (from the upper left corner of the screen) At its native pixel size. Thanks for tips on this regards geir Geir

11-06-2009, 12:51 PM	#7
Beauregard T. Shagnasty Posts: n/a	Re: Position image x,y in html Ben C wrote: > On 2009-11-05, Nik Coughlin <> wrote: >>>> <!DOCTYPE HTML> >>>> <html> ... >>> >>> Yes, although this is invalid-- not supposed to have an IMG just >>> inside BODY like that. Put a DIV around it. >> >> Nope, perfectly valid, look at the doctype. But your advice is good >> for the OP who is probably not authoring as HTML 5 > > I was curious about the doctype. So that's an HTML 5 doctype? Sending Nik's sample to the validator produces this: " Using experimental feature: HTML5 Conformance Checker. The validator checked your document with an experimental feature: HTML5 Conformance Checker. This feature has been made available for your convenience, but be aware that it may be unreliable, or not perfectly up to date with the latest development of some cutting-edge technologies." Personally, I wouldn't use HTML5 until it is listed here: http://www.w3.org/QA/2002/04/valid-dtd-list.html -- -bts -but that's just me... Beauregard T. Shagnasty

Thread Tools	Search this Thread
Show Printable Version Email this Page	Search this Thread: Advanced Search

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Fish Tank Gravel	Andregg@prudence.com	Computer Information	0	05-21-2009 05:36 AM
Hdtv Recorder	Archey@lurlene.com	Wireless Networking	0	05-17-2009 12:18 PM
Canon Powershot Sd750 Digital Camera	Alrod@issac.com	Computer Security	0	05-17-2009 02:39 AM
Acronis True Image 9 burning to DVD questions	All Things Mopar	Computer Support	14	02-19-2006 03:18 AM
Burning CD's (Long - error log included)	fiddaman64	Computer Support	11	05-11-2005 01:49 PM