Absolute Position Fix

162 New Member

Im trying to get an image to center in a div. It works as long as one part of my CSS is commented out. The issues is the part that is breaking it, is required for another script to run that I have not added in due to its vast amount of code. Can anyone tell me a workaround.. leaving the MUST have code in place. Im willing to add anything to the code, just not remove if possible.

Full Code

Expand|Select|Wrap|Line Numbers

 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<head>
 
<style type="text/css">

#image {

    display: table-cell;

    text-align: center;

    vertical-align: middle;

    width:356px;

    height:356px;

    border:1px solid blue;

}

#image * {

    vertical-align: middle;

}

/*\*//*/

#image {

    display: block;

}

#image span {

    display: inline-block;

    height: 100%;

    width: 1px;

}

/**/

</style>

<!--[if IE]><style>

#image span {

    display: inline-block;

    height: 100%;

}

</style><![endif]-->
 
<style type="text/css">

#image img {position:absolute;}

</style>
 
</head>
 
<body>
 
<div id="image"><span></span><img src="http://www.google.com/logos/olympics08_rhythm.gif"></div>
 
</body>

</html>

Code that MUST stay in the CSS

Expand|Select|Wrap|Line Numbers

#image img {position:absolute;}

Just to note, the rest of the code is for the most part an exact dup of the cross-browser image center in div code here, http://www.brunildo.or g/test/img_center.html

Aug 11 '08 #1

Subscribe Reply

5673

drhowarddrfine

7,435

Recognized Expert Expert

Just slapped this together. You'll need to adjust it to fit it into your scheme.
[HTML]
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head><title> </title>
<style type="text/css">
img{position:ab solute;left:50% ;margin-left:-101px}
#image{position :relative;outli ne:1px solid red}
</style>
</head>
<body>
<div id="image"><spa n></span><img src="1.gif"></div>
</body>
</html>
[/HTML]

The 'margin-left' is one-half of the width of the image.

Aug 11 '08 #2

Similar topics

128500

How to get the absolute position of an element

by: Chris Leonard | last post by:

Sorry if I'm posting a similar query again but I think this explanation of what I require is better. I have a page which is very long and as I scroll down the page there are various links, what I'd like to be able to do is when I click on a link return the absolute position within the page of that link. I've looked at event.clientY but this just gives me the offset from the top of the current page, suppose I've scrolled down by 3 pages...

Javascript

2375

Absolute position of a relative element

by: Stephan Koser | last post by:

Hi, how can I get the absolute position of a relative element? We dynamically create a page with multiple segments which are relatively ordered among each other. In these segments we have input fields. When such an input field is focused I need it's absolute position. Is there a way to do so with IE > 6? thanks...

Javascript

1392

absolute position in FOP and following/preceding text

by: TadPole | last post by:

I am using FOP to create PDF documents. I have the problem where I need to create line of text on a document in a certain line (absolute position), then the rest of the text needs to follow after that fixed line of text. What I am getting is the fixed line of text starting at the correct place, but then the rest of the text is then starting at the top of the document.

.NET Framework

7563

Determining Total # of Records and Absolute Position of Current Record on linked Subform

by: Ryan | last post by:

Access97 I hope someone out there can help. This is driving me crazy. Basically, I am trying to recreate VBA's built in navigation feature (The one that allows you to move first, next, previous, and last and also tells you that you are on Record # or . The navigation part was easy. My problem is determing the what record I am on and the total number of records. I put the following code into the my subforms on Current event:

Microsoft Access / VBA

1409

Where is Form Relative Position and Absolute Position in VS.Net 2005 ?

by: Luqman | last post by:

Where is Form Relative Position and Absolute Position in VS.Net 2005 ? Best Regards, Luqman

ASP.NET

5673

Absolute position?

by: Samuel | last post by:

Hi, Is it possible to get absolute position of element with javascript? e.g. I have textbox somewhere in table. Textbox relative to table cell position is 0,0. How can I get Textbox absolute position on page?? Please, any ideas, I'm going crazy... thanks

Javascript

1805

Absolute position

by: SolFrankRosen | last post by:

I'm trying to make a button on my form be in a fixed position, I used: <asp:Button ID="butCancel" style="position:absolute"; runat="server" Text="Cancel" /> but I get an error that this "is not well formed" also is there a way in Visual Web Developer to have ALL new buttons, textboxes, etc. default to "absolute position"?

Visual Basic .NET

1155

page element - absolute position

by: Microsoft Newsserver | last post by:

Im using IE 6/7 / ASP.NET / Javascript. I need to determine the absolute position of elements on my page client side. In summart, I need to know if an event triggered mouse position appears inside a div. Now the rub is that some divs may be absolutely positioned and some may be positioned relatively. I know I can get the position of the mouse using event.clientX or clientY.

ASP.NET

4906

Dynamic create DragPanel extender on client side

by: Bassem | last post by:

Hi, I've two div.s. One contains four images, when click on one, a JS function create an image corresponding to it and append it to the second div. I'm attempting to make each new image is to be movable. I'm trying for three days with many searches to create a DragPanel and set its TargetControlID to the certian images on the client side. I also tried to set the one only DragPanel's TragetControlID property to each image on focus. Anyone...

Javascript

9619

What is ONU?

by: marktang | last post by:

ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...

General

9454

Changing the language in Windows 10

by: Hystou | last post by:

Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...

Windows Server

10102

Maximizing Business Potential: The Nexus of Website Design and Digital Marketing

by: jinu1996 | last post by:

In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...

Online Marketing

8933

AI Job Threat for Devs

by: agi2029 | last post by:

Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...

Career Advice

7460

Access Europe - Using VBA to create a class based on a table - Wed 1 May

by: isladogs | last post by:

The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...

Microsoft Access / VBA

5354

Trying to create a lan-to-lan vpn between two differents networks

by: TSSRALBI | last post by:

Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...

Networking - Hardware / Configuration

4007

transfer the data from one system to another through ip address

by: 6302768590 | last post by:

Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system

C# / C Sharp

3609

How to add payments to a PHP MySQL app.

by: muto222 | last post by:

How can i add a mobile payment intergratation into php mysql website.

PHP

2850

Comprehensive Guide to Website Development in Toronto: Expert Insights from BSMN Consultancy

by: bsmnconsultancy | last post by:

In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

General