473,757 Members | 10,263 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Positioning trouble

On the page at

http://gavelcade.com/tests/trivia.html

I'm expecting the headings and the text that follows them to be positioned
without regard to image or the DIV that contains it, which is positioned
absolutely. In other words, I'm expecting each heading to start even with
the top of the related image, though with a left margin that clears the
image, and then a small leftward jog so that it does start inside the right
edge of the image. The individual items below the headings should have the
same left margin and fall immediately under the headings.

Instead, the images and the DIVs containing them seem to be remaining in the
flow.

Could anyone tell me what I'm missing?

--
Harlan Messinger
Remove the first dot from my e-mail address.
Veuillez ôter le premier point de mon adresse de courriel.

Jul 20 '05 #1
12 1992
Els
Harlan Messinger wrote:
On the page at

http://gavelcade.com/tests/trivia.html

I'm expecting the headings and the text that follows them
to be positioned without regard to image or the DIV that
contains it, which is positioned absolutely. In other
words, I'm expecting each heading to start even with the
top of the related image, though with a left margin that
clears the image, and then a small leftward jog so that it
does start inside the right edge of the image. The
individual items below the headings should have the same
left margin and fall immediately under the headings.

Instead, the images and the DIVs containing them seem to be
remaining in the flow.

Could anyone tell me what I'm missing?


This I think:

img.subjectimag e
is not the same as
div.subjectimag e img :-)

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Now playing: S a a r - 8
Jul 20 '05 #2

"Els" <el*********@ti scali.nl> wrote in message
news:Xn******** *********@130.1 33.1.4...
Harlan Messinger wrote:
On the page at

http://gavelcade.com/tests/trivia.html

I'm expecting the headings and the text that follows them
to be positioned without regard to image or the DIV that
contains it, which is positioned absolutely. In other
words, I'm expecting each heading to start even with the
top of the related image, though with a left margin that
clears the image, and then a small leftward jog so that it
does start inside the right edge of the image. The
individual items below the headings should have the same
left margin and fall immediately under the headings.

Instead, the images and the DIVs containing them seem to be
remaining in the flow.

Could anyone tell me what I'm missing?


This I think:

img.subjectimag e
is not the same as
div.subjectimag e img :-)


Ah, that's what I was overlooking. Thanks. Though

div.subjectimag e img

is also not what I wanted, because I want the whole div to be positioned,
not just the image (which has to be inside a block anyway--or else, AIUI,
the browser will put it in an anonymous block). So I changed it to

div.subjectimag e

and now I have a different problem in IE6, which has moved the images to the
right so that they are left-aligned with the text. Opera and Firefox are
fine. Can I just not do something this complicated with IE in the picture?

Jul 20 '05 #3

"Harlan Messinger" <h.*********@co mcast.net> wrote in message
news:2l******** ****@uni-berlin.de...
Ah, that's what I was overlooking. Thanks. Though

div.subjectimag e img

is also not what I wanted, because I want the whole div to be positioned,
not just the image (which has to be inside a block anyway--or else, AIUI,
the browser will put it in an anonymous block). So I changed it to

div.subjectimag e

and now I have a different problem in IE6, which has moved the images to the right so that they are left-aligned with the text. Opera and Firefox are
fine. Can I just not do something this complicated with IE in the picture?


This kills me: it even works in Netscape 4.7. Just not IE.

Jul 20 '05 #4
Els
Harlan Messinger wrote:
"Els" <el*********@ti scali.nl> wrote in message
news:Xn******** *********@130.1 33.1.4...
Harlan Messinger wrote:
> On the page at
>
> http://gavelcade.com/tests/trivia.html
>
> I'm expecting the headings and the text that follows
> them to be positioned without regard to image or the DIV
> that contains it, which is positioned absolutely. In
> other words, I'm expecting each heading to start even
> with the top of the related image, though with a left
> margin that clears the image, and then a small leftward
> jog so that it does start inside the right edge of the
> image. The individual items below the headings should
> have the same left margin and fall immediately under the
> headings.
>
> Instead, the images and the DIVs containing them seem to
> be remaining in the flow.
>
> Could anyone tell me what I'm missing?


This I think:

img.subjectimag e
is not the same as
div.subjectimag e img :-)


Ah, that's what I was overlooking. Thanks. Though

div.subjectimag e img

is also not what I wanted, because I want the whole div to
be positioned, not just the image (which has to be inside a
block anyway--or else, AIUI, the browser will put it in an
anonymous block). So I changed it to

div.subjectimag e

and now I have a different problem in IE6, which has moved
the images to the right so that they are left-aligned with
the text. Opera and Firefox are fine. Can I just not do
something this complicated with IE in the picture?


Eh.. I don't see the images anymore with Firebird...

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Now playing: S a a r - 11
Jul 20 '05 #5
Els
Harlan Messinger wrote:
"Harlan Messinger" <h.*********@co mcast.net> wrote in
message news:2l******** ****@uni-berlin.de...
Ah, that's what I was overlooking. Thanks. Though

div.subjectimag e img

is also not what I wanted, because I want the whole div to
be positioned, not just the image (which has to be inside
a block anyway--or else, AIUI, the browser will put it in
an anonymous block). So I changed it to

div.subjectimag e

and now I have a different problem in IE6, which has moved
the images to

the
right so that they are left-aligned with the text. Opera
and Firefox are fine. Can I just not do something this
complicated with IE in the picture?


This kills me: it even works in Netscape 4.7. Just not IE.


I haven't figured why (yet), but if you give the relative
positioned div a border (white, to match the background) the
pictures jumps into place, and if you then delete the z-index
from the absolute positioned div, Firebird shows the pics too.
I suppose z-index:-2 puts them behind the screen or something
;-)

Bugs me that I don't know why the border helps though :-(

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Now playing: Meir Banai - The Shafshaf Song
Jul 20 '05 #6

"Els" <el*********@ti scali.nl> wrote in message
news:Xn******** *********@130.1 33.1.4...
Harlan Messinger wrote:
"Harlan Messinger" <h.*********@co mcast.net> wrote in
message news:2l******** ****@uni-berlin.de...
Ah, that's what I was overlooking. Thanks. Though

div.subjectimag e img

is also not what I wanted, because I want the whole div to
be positioned, not just the image (which has to be inside
a block anyway--or else, AIUI, the browser will put it in
an anonymous block). So I changed it to

div.subjectimag e

and now I have a different problem in IE6, which has moved
the images to the
right so that they are left-aligned with the text. Opera
and Firefox are fine. Can I just not do something this
complicated with IE in the picture?


This kills me: it even works in Netscape 4.7. Just not IE.


I haven't figured why (yet), but if you give the relative
positioned div a border (white, to match the background) the
pictures jumps into place, and if you then delete the z-index
from the absolute positioned div, Firebird shows the pics too.
I suppose z-index:-2 puts them behind the screen or something
;-)


Oh, I hadn't noticed that the z-index caused trouble in Firebird (and
Firefox) because I looked at them before Opera. I added the z-index because
in Opera the photo was lying over the overlapping portion of the heading.

Now I've just switched things so that the image has no z-index, and the h2
has z-index: 2. That makes Firebird, Firefox, and Opera happy. I suppose
this means Firebird and Firefox don't handle negative z-index properly, at
least not for images or their containing boxes. I know z-index *can* be
negative, so it seems to be a browser bug.

Bugs me that I don't know why the border helps though :-(


Yup, me too. Thanks for your help.

Jul 20 '05 #7

"Harlan Messinger" <h.*********@co mcast.net> wrote in message
news:2l******** ****@uni-berlin.de...

"Els" <el*********@ti scali.nl> wrote in message
news:Xn******** *********@130.1 33.1.4...
Harlan Messinger wrote:
"Harlan Messinger" <h.*********@co mcast.net> wrote in
message news:2l******** ****@uni-berlin.de...
> Ah, that's what I was overlooking. Thanks. Though
>
> div.subjectimag e img
>
> is also not what I wanted, because I want the whole div to
> be positioned, not just the image (which has to be inside
> a block anyway--or else, AIUI, the browser will put it in
> an anonymous block). So I changed it to
>
> div.subjectimag e
>
> and now I have a different problem in IE6, which has moved
> the images to
the
> right so that they are left-aligned with the text. Opera
> and Firefox are fine. Can I just not do something this
> complicated with IE in the picture?

This kills me: it even works in Netscape 4.7. Just not IE.
I haven't figured why (yet), but if you give the relative
positioned div a border (white, to match the background) the
pictures jumps into place, and if you then delete the z-index
from the absolute positioned div, Firebird shows the pics too.
I suppose z-index:-2 puts them behind the screen or something
;-)


Oh, I hadn't noticed that the z-index caused trouble in Firebird (and
Firefox) because I looked at them before Opera. I added the z-index

because in Opera the photo was lying over the overlapping portion of the heading.

Now I've just switched things so that the image has no z-index, and the h2
has z-index: 2. That makes Firebird, Firefox, and Opera happy. I suppose
this means Firebird and Firefox don't handle negative z-index properly, at
least not for images or their containing boxes. I know z-index *can* be
negative, so it seems to be a browser bug.

Bugs me that I don't know why the border helps though :-(


Yup, me too. Thanks for your help.


Ugh, now it's still bad in IE. The second trivia item and everything
underneath it is shifted to the left.

Jul 20 '05 #8

"Harlan Messinger" <h.*********@co mcast.net> wrote in message
news:2l******** ****@uni-berlin.de...

"Harlan Messinger" <h.*********@co mcast.net> wrote in message
news:2l******** ****@uni-berlin.de...

"Els" <el*********@ti scali.nl> wrote in message
news:Xn******** *********@130.1 33.1.4...
negative, so it seems to be a browser bug.

Bugs me that I don't know why the border helps though :-(


Yup, me too. Thanks for your help.


Ugh, now it's still bad in IE. The second trivia item and everything
underneath it is shifted to the left.


Er...now it's fixed itself.

Jul 20 '05 #9
Els
Harlan Messinger wrote:
Ugh, now it's still bad in IE. The second trivia item and
everything underneath it is shifted to the left.


Er...now it's fixed itself.


Right. <g>

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Now playing: Michael Shaviv - War Sane - Tango
Jul 20 '05 #10

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

Similar topics

2
1257
by: Dennis M. Marks | last post by:
Please ignore all previous postings from me for the past couple of days. All has been solved except for the following. I have three divisions that I am having trouble positioning. What works in IE does not work in Netscape. I have removed all top and left positioning from the css. If you look at my current home page you will see 3 divisions on the bottom. There is a calendar (calendar), calendar controls (controls), and a counter...
0
1585
by: crjr | last post by:
I'm having trouble with positioning in Netscape 7.02. It looks the way I want it to in IE 6, Opera and iRider, but in Netscape and Mozilla, the MENU drops way too low. Also, in Netscape the background image (a logo at the top of the page) is getting covered up by the #main content. Any help would be greatly appreciated. Here's the URLs to both the page and the CSS file. http://www.flashsongs.com/EPOXYFILMS_COM/index.html...
7
6309
by: Griff Miller | last post by:
Please see http://home.houston.rr.com/gmiller15/css/vertprob.html . In mozilla 1.6/1.7 it looks the way I want it, with a thin separation between the two boxes. In IE6, the two boxes touch, which is not what I want. Is there a way to get IE6 to do it the mozilla way? Thanks! Griff
1
6347
by: Mr.Clean | last post by:
I'm having trouble with this. The checkbox is no where near where it is supposed to be and the radio button is not at 206 px away from the left of the window. Looks bad in IE6, even worse in Firefox1.0. I tried using <label> tags but they didn't come out right either. Need the class xxxx_Label because I may be having the text to the left of the check or radiobutton.
17
3049
by: George Hester | last post by:
http://tinyurl.com/5uj6w The lower middle icon the "block" should not drop down when the mouse is over it. How can I stop that? Also the navigation divs both top and bottom should follow the scroll right. Both of these issues occur in IE 6 but not in IE 5.5. You can get the horizontal scroll bar for the window by increasing the size of the image wider than the display area of the window. Assumes 600x800 default display size. Thanks...
2
1791
by: Johnson Smith | last post by:
Question is related to ASP.Net and controlling the position of these controls. I am using html table to placce my web controls. I am displaying same datagrid and calendar controls at clicks of different buttons. Since I am using same control for various clicks, it is hard for me to place the controls at runtime for my required position. Any suggestions of doing this will be a great help. Johnson Smith
9
3388
by: Bill Norton | last post by:
I've been experimenting with floats, positioning and offsets (top, left, etc.) to see what happens when you mix the properties together. All this may be old news to most of you, but it was extremely helpful to me. The results are summarized in this chart. In all these tests I was using a single child element inside a containing block. (I hope the formatting doesn't fall apart too badly when it's uploaded to a newsgroup.) | Do Floats | Do...
5
1886
by: aljamala | last post by:
Hi, I have a group of 5 tables laid out of the web page. 2 go on the left side and 3 on the right. These tables retrieve data from the database so the number of records (rows) returned varies. So the problem I am having at the moment is that if the table gets longer by one or two rows, all my alignment goes of out whack for the other tables. Is there a way for example to place table #2 right after table#1 ends?
1
2539
by: alice | last post by:
Can someone point me to a page that has good info on how the different browsers handle positioning? I'm finding that position:absolute works differently between Safari and IE7. Sort of ironic if you ask me. I can't seem to easily find anything on the web about how to handle this. Is there some sort of hack for IE?
14
3314
by: Fistro | last post by:
I'm trying to find a design that would allow me to build web pages without having to worry about compatibility issues (not too much, in any case,,,) I've came across this CSS layout technique: http://alistapart.com/articles/fauxabsolutepositioning It calculates the left offset from a fixed position, as opposed to calculating it from the right edge of the preceding element by using a combination of position: relative, left: 100% and a...
0
9489
marktang
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...
0
9298
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,...
1
9885
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
9737
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
0
8737
agi2029
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...
1
7286
isladogs
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...
0
6562
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
5329
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
3
3399
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.

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.