Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > Position image x,y in html

Reply
Thread Tools

Position image x,y in html

 
 
Geir
Guest
Posts: n/a
 
      11-04-2009
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
 
Reply With Quote
 
 
 
 
Adrienne Boswell
Guest
Posts: n/a
 
      11-04-2009
Gazing into my crystal ball I observed Geir <(E-Mail Removed)> writing
in news:(E-Mail Removed):

> 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

 
Reply With Quote
 
 
 
 
Nik Coughlin
Guest
Posts: n/a
 
      11-04-2009
"Geir" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed)...
> 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>



 
Reply With Quote
 
Nik Coughlin
Guest
Posts: n/a
 
      11-05-2009
"Ben C" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed)...
> On 2009-11-04, Nik Coughlin <(E-Mail Removed)> wrote:
>> "Geir" <(E-Mail Removed)> wrote in message
>> news:(E-Mail Removed)...
>>> 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

 
Reply With Quote
 
Nik Coughlin
Guest
Posts: n/a
 
      11-05-2009
"Nik Coughlin" <(E-Mail Removed)> wrote in message
news:hcvl58$446$(E-Mail Removed)-september.org...
> "Ben C" <(E-Mail Removed)> wrote in message
> news:(E-Mail Removed)...
>> On 2009-11-04, Nik Coughlin <(E-Mail Removed)> 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">

 
Reply With Quote
 
Travis Newbury
Guest
Posts: n/a
 
      11-05-2009
On Nov 4, 9:20*am, Geir <(E-Mail Removed)> 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....
 
Reply With Quote
 
Beauregard T. Shagnasty
Guest
Posts: n/a
 
      11-06-2009
Ben C wrote:

> On 2009-11-05, Nik Coughlin <(E-Mail Removed)> 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...
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
HTML 101 Position image relative to GridView row =?Utf-8?B?RGFsZQ==?= ASP .Net 2 10-22-2006 04:46 AM
Where is Form Relative Position and Absolute Position in VS.Net 2005 ? Luqman ASP .Net 1 02-07-2006 10:27 AM
position image based on document position edouard.lauer@pt.lu Javascript 3 01-14-2006 06:04 PM
I thought it was "impossible" to precisely dictate image position with html commands? Doc HTML 11 10-04-2004 05:40 PM
html to image or html to postcript to image Lukasz Indyk Python 4 05-17-2004 06:06 PM



Advertisments