473,320 Members | 2,112 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,320 software developers and data experts.

Absolute positioning a box to a specific distance from left and rightside of the page

Following works in Mozilla, Opera and IE.

<div style="
left: 100px;
right: 200px;
/* JavaScript-hack for IE*/
width: expression((document.body.clientWidth - 100 - 200) + 'px')
">
<span>Text<span>
<div>

But this requires JavaScript enabled for IE. If its not enabled box's
width is same style "width: auto".

Is it possible to do calculations with CSS (here I would need width:
100% - 150px - 150px)?

Or is there another solution for this problem?
Jul 20 '05 #1
7 4730
qwerty wrote:
Following works in Mozilla, Opera and IE.

<div style="
left: 100px;
right: 200px;
/* JavaScript-hack for IE*/
width: expression((document.body.clientWidth - 100 - 200) + 'px')
">
<span>Text<span>
<div>

But this requires JavaScript enabled for IE. If its not enabled box's
width is same style "width: auto".
Can you turn JS off in IE?
Is it possible to do calculations with CSS (here I would need width:
100% - 150px - 150px)?
No.
Or is there another solution for this problem?


Do you need it to be absolutely positioned? See:

http://tranchant.plus.com/tmp/box

--
Mark.
http://tranchant.plus.com/
Jul 20 '05 #2
On Thu, 30 Sep 2004, qwerty wrote:
Is it possible to do calculations with CSS
No.
(here I would need width: 100% - 150px - 150px)?
Then inevitably the answer has to be "don't do that".
Or is there another solution for this problem?


In a web context (which is what c.i.w.a.s is about), the solution is
to stop trying to exert precise control over things that aren't
amenable to your precise control. Learn to design flexibly, and
let your pages accommodate themselves to what they find in the many
diverse browsing situations that they are going to find, out there on
the WWW.

There's nothing wrong with wanting your pages to look the way you want
them to look, in the situation that you design them for. But when an
author starts trying to force them to be the same in *every* browser
configuration, then everything starts going nasty. So don't do that.

good luck
Jul 20 '05 #3
Mark Tranchant wrote:
qwerty wrote:
Following works in Mozilla, Opera and IE.

<div style="
left: 100px;
right: 200px;
/* JavaScript-hack for IE*/
width: expression((document.body.clientWidth - 100 - 200) + 'px')
">
<span>Text<span>
<div>

But this requires JavaScript enabled for IE. If its not enabled box's
width is same style "width: auto".

Can you turn JS off in IE?

Yes, it´s in sSecurity options item called "Active Scripting".
Is it possible to do calculations with CSS (here I would need width:
100% - 150px - 150px)?

No.

Seems to be so.
Or is there another solution for this problem?

Do you need it to be absolutely positioned? See:

http://tranchant.plus.com/tmp/box

Using relative positioning and margins would be one possibility but I
need to set my divs in a strict order to a page and think divs´s places
relatively to each other. I would want to use absolute position so that
changing pages later for users would be handy.
Jul 20 '05 #4
Alan J. Flavell wrote:
On Thu, 30 Sep 2004, qwerty wrote:

Is it possible to do calculations with CSS

No.

(here I would need width: 100% - 150px - 150px)?

Then inevitably the answer has to be "don't do that".

That would succeed already with style "left: 150px; right: 150px" if IE
would hanlde this correctly..so it would possible in theory..but in
practise IE makes is impossible..
Or is there another solution for this problem?

In a web context (which is what c.i.w.a.s is about), the solution is
to stop trying to exert precise control over things that aren't
amenable to your precise control. Learn to design flexibly, and
let your pages accommodate themselves to what they find in the many
diverse browsing situations that they are going to find, out there on
the WWW.

There's nothing wrong with wanting your pages to look the way you want
them to look, in the situation that you design them for. But when an
author starts trying to force them to be the same in *every* browser
configuration, then everything starts going nasty. So don't do that.

I understand your view.

But nowdays CSS should let designer to make page look the way he/she
wants it to look, thing what HTML wasn't planned for. This would be more
close to reality if IE would obey standards..

I think I must make some compromises in my design idea, or except that
most IE users don't disable JavaScript and the I can design page the way
I want (if I don't be faced with more hard troubles relating CSS and IE
wich couldn't be solved)..
good luck

I feel that it´s luck what I need handling with IE and standards issues..
Jul 20 '05 #5
>> Do you need it to be absolutely positioned? See:

http://tranchant.plus.com/tmp/box


Using relative positioning and margins would be one possibility but I
need to set my divs in a strict order to a page and think divs´s places
relatively to each other. I would want to use absolute position so that
changing pages later for users would be handy.


What? Non-absolutely-positioned divs appear in the same order as they
are in the source. The only "relative" thing is that each div appears
after the one before, just like any non-positioned block element.

--
Mark.
http://tranchant.plus.com/

Jul 20 '05 #6
Hello,
<div style="
left: 100px;
right: 200px;
/* JavaScript-hack for IE*/
width: expression((document.body.clientWidth - 100 - 200) + 'px')
">
<span>Text<span>
<div>
[...]
Or is there another solution for this problem?


What about
<div style="margin-left:100px; margin-right:200px;">
<span>Text<span>
<div>
?

Robert
Jul 20 '05 #7
On Thu, 30 Sep 2004, qwerty quoted me:
There's nothing wrong with wanting your pages to look the way you
want them to look, in the situation that you design them for.
But when an author starts trying to force them to be the same in
*every* browser configuration, then everything starts going nasty.
So don't do that.
I understand your view.


What followed, gives me reason to doubt that.
But nowdays CSS should let designer to make page look the way he/she
wants it to look,
I think the regulars around here (c.i.w.a.s) rather expected you to
say that. I know that I did. But it doesn't change the fact that
browsing situations are getting *more* diverse with time. And the
need to accommodate diversity is getting recognised as an important
part of communicating with a wider audience, not only because of WAI
guidelines and associated legislation.
thing what HTML wasn't planned for.
What little you know about the history of HTML!
This would be more close to reality if IE would obey standards..


You're confusing two quite different issues - diversity of browsing
on the one hand, and browser bugs on the other.

bye.
Jul 20 '05 #8

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

Similar topics

12
by: Tom Szabo | last post by:
Hi, Just wondering if there are any disadvantage in absolute positioning controls on a page? In example instead of putting the text fields into a table to align properly, one would absolute...
14
by: Harlan Messinger | last post by:
What am I not understanding about the definition of { position: absolute; }? "The box's position (and possibly size) is specified with the 'left', 'right', 'top', and 'bottom' properties. These...
7
by: Thomas Elser | last post by:
Hi, I made a site using CSS absolute positioning for all my content on the page. Now I try to figure out if it is possible to center the pages without giving up the absolute positioning. Can...
28
by: jonjon | last post by:
Hi, I want to be able to define the right property of my absolute positionned elements... for example if a button is 50px left and 150px right, it will resize when the page is resized. This is...
3
by: Greg G | last post by:
We have a band web site. Here's the site now: http://www.risky-biz.com The home page has a "collage" of photos of the members of the band. The collage is actually one .gif image that I put...
3
by: horusprim | last post by:
Is there a CSS absolute positioning rendering bug in FF1.02 and IE 6? I have been experimenting with precision absolute positioning in CSS. The following test content was used in the...
2
by: nonsensitor | last post by:
I'm just learning xhtml & css, primarily from westciv's online tutorials and css guide. I've run into a couple of problems with a page I'm developing that I can't figure out. The first problem is...
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...
3
by: goldenboy651 | last post by:
My Positioning in IE 6 is exactly the way I want it, but when I view the page in my firefox browser things are out of place. When I try and change the css my IE page moves, but the firefox doesn't. ...
0
by: DolphinDB | last post by:
The formulas of 101 quantitative trading alphas used by WorldQuant were presented in the paper 101 Formulaic Alphas. However, some formulas are complex, leading to challenges in calculation. Take...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
0
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
0
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
by: af34tf | last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...

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.