473,387 Members | 1,789 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,387 software developers and data experts.

Problem: Dynamically center layers on centered web page - IE + Firefox

Hi,

Hope no-one is offended by my probably noob question...

Context:
I have a web page design, which always centres in the middle of the
screen (using a 100%*100% HTML-table). Now I also use layers, that get
visible when something is clicked. All works fine.

Problem:
All works fine... Except when chancing screen resolution or when
resizing the browser window :( I need the layers to stay centered on the
centered HTML-table, when resizing the web page or when a user uses a
different screen resolution.

Question:
Is it possible to dynamically center/reposition the layers I use, when a
user is resizing the web page or when a user uses a different screen
resolution..?

Many thanks for any help/advise/links,

Frederik, Amsterdam, Holland
Jul 20 '05 #1
8 11082
On Tue, 24 Aug 2004 23:05:18 +0200, Freek te Water <f.*******@amc.uva.nl>
wrote:
Hi,

Hope no-one is offended by my probably noob question...

Context:
I have a web page design, which always centres in the middle of the
screen (using a 100%*100% HTML-table). Now I also use layers, that get
visible when something is clicked. All works fine.
I'll assume "layers" in this context means positioned or floated elements,
which is I believe a Dreamweaver term. Be aware the term "layers" is not
properly a CSS term, and can mean other things in different contexts.
Problem:
All works fine... Except when chancing screen resolution or when
resizing the browser window :( I need the layers to stay centered on the
centered HTML-table, when resizing the web page or when a user uses a
different screen resolution.

Question:
Is it possible to dynamically center/reposition the layers I use, when a
user is resizing the web page or when a user uses a different screen
resolution..?

Many thanks for any help/advise/links,

Frederik, Amsterdam, Holland


It might be possible, but first you need to provide a link for us!

Set up a test case which demonstrates the problem with as little detail as
you can. Post the URL here and we'll look it over.
Jul 20 '05 #2
Neal wrote:
On Tue, 24 Aug 2004 23:05:18 +0200, Freek te Water
<f.*******@amc.uva.nl> wrote:
Hi,

Hope no-one is offended by my probably noob question...

Context:
I have a web page design, which always centres in the middle of the
screen (using a 100%*100% HTML-table). Now I also use layers, that get
visible when something is clicked. All works fine.

I'll assume "layers" in this context means positioned or floated
elements, which is I believe a Dreamweaver term. Be aware the term
"layers" is not properly a CSS term, and can mean other things in
different contexts.


You're right, I mean positioned or floating elements that
(D)HTML-editing programs like DreamWeaver call Layers.
Problem:
All works fine... Except when chancing screen resolution or when
resizing the browser window :( I need the layers to stay centered on
the centered HTML-table, when resizing the web page or when a user
uses a different screen resolution.

Question:
Is it possible to dynamically center/reposition the layers I use, when
a user is resizing the web page or when a user uses a different screen
resolution..?

Many thanks for any help/advise/links,

Frederik, Amsterdam, Holland

It might be possible, but first you need to provide a link for us!

Set up a test case which demonstrates the problem with as little detail
as you can. Post the URL here and we'll look it over.


Thanks, I've set it all up at this address:
http://www.isabelnabuurs.nl/try.htm
Jul 20 '05 #3
Els
Freek de Stoute wrote:
Neal wrote:

Freek te Water wrote:


Freek, mag jij van je moeder het water wel in?

--
Els
http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Jul 20 '05 #4
Els wrote:


Freek, mag jij van je moeder het water wel in?


Ja, dat mag ik, echt..! Maar niet tegen m'n moeder zeggen ;)
Jul 20 '05 #5
Els
Freek de Stoute wrote:
Els wrote:
Freek, mag jij van je moeder het water wel in?


Ja, dat mag ik, echt..! Maar niet tegen m'n moeder zeggen ;)


<g>

--
Els
http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Jul 20 '05 #6
Hi Neal & everyone here,

I would like to repeat my earlier question (Dynamically center
layers...), to avoid it getting lost in chitchat with Els :)...

Context:
I have a web page design, which always centres in the middle of the
screen (using a 100%*100% HTML-table). Now I also use *floating
elements*, that get visible after user interaction. So far no trouble.
Problem:
All works fine... Except when chancing screen resolution or when
resizing the browser window :( I need the layers to stay centered on
the centered HTML-table, when resizing the web page or when a user
uses a different screen resolution.

Question:
Is it possible to dynamically center/reposition the layers I use, when
a user is resizing the web page or when a user uses a different screen
resolution..?

Many thanks for any help/advise/links,

Frederik, Amsterdam, Holland

It might be possible, but first you need to provide a link for us!

Set up a test case which demonstrates the problem with as little detail
as you can. Post the URL here and we'll look it over.


Thanks, I've set it all up at this address:
http://www.isabelnabuurs.nl/try.htm
Jul 20 '05 #7
Els
Freek de Stoute wrote:
Hi Neal & everyone here,
Hi Freek ;-)
I would like to repeat my earlier question (Dynamically
center layers...), to avoid it getting lost in chitchat
with Els :)...
:-(

[problem centering table while on top of centered background]
Thanks, I've set it all up at this address:
http://www.isabelnabuurs.nl/try.htm


It's probably just me, but the page works, yet the stylesheet
(/isabel.css) is not where I'm trying to find it:
http://www.isabelnabuurs.nl/isabel.css
Am I missing something?

To see what you're doing wrong, I need to see the stylesheet.
Unless the stylesheet doesn't do anything...
.... copied the html to my local server... indeed, the
stylesheet reference is obsolete.
Okay...

Checking the html, I see it's a lot of JavaScript (which I
don't understand at all) and then a bunch of position:absolute
styles...

Sorry, but afaics this won't work.
You need to put that table *inside* the div that you are now
"laying it over" (hope that makes sense)

Position:absolute takes stuff out of the flow of the page.
You state for the LIVEthumbox:
position:absolute; left:319; top:100px;
That's where you put the pics. exactly 319 pixels from the
left side of the window, and 100px from the top.
You use Z-index to make them show in front of the page.
That page you make liquid.

This page just does what you tell it to. If the window gets
narrow, the page goes to the left, and the thumbnails stay
where you told them to stay: 319 pixels from the left.

Btw, great picture:
http://www.isabelnabuurs.nl/images/l...and/DeDijk.jpg

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Now playing: The Scene - Geloof
Jul 20 '05 #8
Els wrote:

Sorry, but afaics this won't work.
You need to put that table *inside* the div that you are now
"laying it over" (hope that makes sense)

Position:absolute takes stuff out of the flow of the page.
You state for the LIVEthumbox:
position:absolute; left:319; top:100px;
That's where you put the pics. exactly 319 pixels from the
left side of the window, and 100px from the top.
You use Z-index to make them show in front of the page.
That page you make liquid.

This page just does what you tell it to. If the window gets
narrow, the page goes to the left, and the thumbnails stay
where you told them to stay: 319 pixels from the left.

Btw, great picture:
http://www.isabelnabuurs.nl/images/l...and/DeDijk.jpg


Great help, Els..!
It seems I have a lot to learn, but I understand your solution and will
work on it today. Will keep you posted if you don't mind.

Thanks again for your time and trouble,

Freek
Jul 20 '05 #9

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

4
by: Mimo Zus | last post by:
I'm hoping that someone can explain what's going on; better yet provide a workaround. I'm designing a centered CSS site based on a 550 pixel wide vertical background image. Onto this background...
11
by: Mark Schneider | last post by:
I'm trying to avoid using <table> for formatting purposes where other, reasonable means exist. I'm stuck trying to find a way to find an equivalent for the code below. <table align="center">...
3
by: ben.saur | last post by:
I am having a problem viewing a centered table using Firefox. When the page is long enough to scroll, the alignment moves slightly to the left. The alignment doesn't change when I view the page...
2
by: nino9stars | last post by:
Hello, I have just started messing with absolute positioning on webpages, and it definitely let's you do some creative things. Well, after much searching and help, I got the images I was using...
5
by: althafexcel | last post by:
hi everyone Im trying to include an external js in my aspx page under the head tag, it doesn't load or it displays an object expected error whenver the function from the .js is called. Actually...
1
by: judacris | last post by:
I've seen the threads here about molding 2 divs in a centered fashion. but I can't seem to solve this thing. my blogger blog is functioning well on my site for now, but the blog feed (left) and...
12
by: sheldonlg | last post by:
Here is my situation. I am coding in an AJAX framework for an intranet application behind a vpn. Therefore, I can't give you a URL for the actual app. I made a sample app for viewing and am...
19
by: Jim | last post by:
Hi, I have two questions/problems pertaining to CSS horizontal dropdown menus and am hoping that someone here can help me out. (1) I'm having a problem centering the menu. I picked up the...
13
by: Stevo | last post by:
I've found that for IE6+, if you add the property text-align:center to a DIV, then *anything* inside it gets centered. That can be a table, an object/embed, another DIV, an image, or some text. ...
0
by: taylorcarr | last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
0
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
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...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
jinu1996
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...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.