Hi,
Ok, I've solved most of the layout issues I was having with the template I'm
building and it looks ok in both IE and FF.
One thing remains though and its driving me nuts. I've got two divs's
displayed next too each other to make two cols, the left hand div set at a
width of 250px, the right hand div no width set.
In FF the right div starts at the edge of the left div and displays
correctly, however in IE the right div starts at the edge of the page
(although the text in the div starts at the edge of the left div).
So If i set margin-left on the maincontent div to 255px in IE it sits where
I want, but in FF it sits 255px away from the left div which just looks
wrong.
The URL is: http://www.paulwatt.info/test/turn/ .
and http://www.paulwatt.info/test/turn/css/turnlayout.css
I've been searching google and I cant find a answer. I suspect that FF is
behaving properly and IE is doing its usual thing.
many thanks in advance
Paul
-- http://www.paulwatt.info 13 1433
"Paul Watt" <pa**********@wattio.freeserve.co.uk> wrote in message
news:49************@individual.net... Hi, Ok, I've solved most of the layout issues I was having with the template I'm building and it looks ok in both IE and FF. One thing remains though and its driving me nuts. I've got two divs's displayed next too each other to make two cols, the left hand div set at a width of 250px, the right hand div no width set. In FF the right div starts at the edge of the left div and displays correctly, however in IE the right div starts at the edge of the page (although the text in the div starts at the edge of the left div).
So If i set margin-left on the maincontent div to 255px in IE it sits where I want, but in FF it sits 255px away from the left div which just looks wrong.
Because "leftcell" is floated, it's not counted when placing the
"maincontent" div.
I think both browsers have it wrong...
Firefox, because it's not truly floating the "leftcell" div.
IE, because it takes into account the foated div, but then doesn't apply the
content based on it.
Try sqashing your browsers narrower and you'll see IE starts wrapping the
content at the left margin.
Paul Watt wrote: Hi, Ok, I've solved most of the layout issues I was having with the template I'm building and it looks ok in both IE and FF. One thing remains though and its driving me nuts. I've got two divs's displayed next too each other to make two cols, the left hand div set at a width of 250px, the right hand div no width set. In FF the right div starts at the edge of the left div and displays correctly, however in IE the right div starts at the edge of the page (although the text in the div starts at the edge of the left div).
So If i set margin-left on the maincontent div to 255px in IE it sits where I want, but in FF it sits 255px away from the left div which just looks wrong.
The URL is: http://www.paulwatt.info/test/turn/ . and http://www.paulwatt.info/test/turn/css/turnlayout.css
..leftcell{
margin-top:5px;
width: 250px;
position: absolute;
}
Look into FLOAT, and lose position:absolute
"Tony" <to****@dslextreme.WHATISTHIS.com> wrote in message
news:12*************@corp.supernews.com... Paul Watt wrote: Hi, Ok, I've solved most of the layout issues I was having with the template I'm building and it looks ok in both IE and FF. One thing remains though and its driving me nuts. I've got two divs's displayed next too each other to make two cols, the left hand div set at a width of 250px, the right hand div no width set. In FF the right div starts at the edge of the left div and displays correctly, however in IE the right div starts at the edge of the page (although the text in the div starts at the edge of the left div).
So If i set margin-left on the maincontent div to 255px in IE it sits where I want, but in FF it sits 255px away from the left div which just looks wrong.
The URL is: http://www.paulwatt.info/test/turn/ . and http://www.paulwatt.info/test/turn/css/turnlayout.css
.leftcell{ margin-top:5px; width: 250px; position: absolute; }
Look into FLOAT, and lose position:absolute
I tried Float but it wasnt working for me, so I had to resort to
position:absolute.
"Tony" <to****@dslextreme.WHATISTHIS.com> wrote in message
news:12*************@corp.supernews.com... Paul Watt wrote:
The URL is: http://www.paulwatt.info/test/turn/ . and http://www.paulwatt.info/test/turn/css/turnlayout.css
.leftcell{ margin-top:5px; width: 250px; position: absolute; }
Look into FLOAT, and lose position:absolute
I tried Float but it wasnt working for me, so I had to resort to position:absolute.
What happened when you used float?
I had two cells leftcell and maincontent; I had leftcell (float:left;
width:250px;) and maincontent(no float,margin-left:255px;). IE and FF
couldnt decide where to start counting the 255px from because leftcell was
floated.
Paul
In article <49************@individual.net>,
Paul Watt <pa**********@wattio.freeserve.co.uk> wrote: I had two cells leftcell and maincontent; I had leftcell (float:left; width:250px;) and maincontent(no float,margin-left:255px;). IE and FF couldnt decide where to start counting the 255px from because leftcell was floated.
Try and see what happens if you set a margin-left: -1px; in the
left-floated box. It fixes up a similar problem in NS4.
See: http://realworldstyle.com/2col.html
I have found this to be a very useful example for my own page layouts.
-A
Paul Watt wrote: "Tony" <to****@dslextreme.WHATISTHIS.com> wrote in message news:12*************@corp.supernews.com...
I tried Float but it wasnt working for me, so I had to resort to position:absolute.
What happened when you used float?
I had two cells leftcell and maincontent; I had leftcell (float:left; width:250px;) and maincontent(no float,margin-left:255px;). IE and FF couldnt decide where to start counting the 255px from because leftcell was floated.
What happens if you leave off the margin-left:255px?
To further the education of mankind, "Paul Watt"
<pa**********@wattio.freeserve.co.uk> declaimed: Hi, Ok, I've solved most of the layout issues I was having with the template I'm building and it looks ok in both IE and FF. One thing remains though and its driving me nuts. I've got two divs's displayed next too each other to make two cols, the left hand div set at a width of 250px, the right hand div no width set. In FF the right div starts at the edge of the left div and displays correctly, however in IE the right div starts at the edge of the page (although the text in the div starts at the edge of the left div).
So If i set margin-left on the maincontent div to 255px in IE it sits where I want, but in FF it sits 255px away from the left div which just looks wrong.
The URL is: http://www.paulwatt.info/test/turn/ . and http://www.paulwatt.info/test/turn/css/turnlayout.css
Try adding left:0; to your .leftcell css. (Untried.)
--
Neredbojias
Infinity can have limits.
"Neredbojias" <http://www.neredbojias.com/fliam.php?cat=alt.html> wrote in
message news:Xn**********************************@208.49.8 0.251... To further the education of mankind, "Paul Watt" <pa**********@wattio.freeserve.co.uk> declaimed:
Hi, Ok, I've solved most of the layout issues I was having with the template I'm building and it looks ok in both IE and FF. One thing remains though and its driving me nuts. I've got two divs's displayed next too each other to make two cols, the left hand div set at a width of 250px, the right hand div no width set. In FF the right div starts at the edge of the left div and displays correctly, however in IE the right div starts at the edge of the page (although the text in the div starts at the edge of the left div).
So If i set margin-left on the maincontent div to 255px in IE it sits where I want, but in FF it sits 255px away from the left div which just looks wrong.
The URL is: http://www.paulwatt.info/test/turn/ . and http://www.paulwatt.info/test/turn/css/turnlayout.css
Try adding left:0; to your .leftcell css. (Untried.)
All sorted now using a mix of absolute positioning and a IE browser hack!
Thanks any way
Paul.
In article <49************@individual.net>,
"Paul Watt" <pa**********@wattio.freeserve.co.uk> wrote: What happened when you used float?
I had two cells leftcell and maincontent; I had leftcell (float:left; width:250px;) and maincontent(no float,margin-left:255px;). IE and FF couldnt decide where to start counting the 255px from because leftcell was floated.
They do decide, it is just that they decide differently to each
other. And IE deviates from the css standards. If you left float
a nav block, IE displaces the whole of the next block, not just
its content (eg, words).
It is a headache, true, but you need to get to grips with it, it
is really a fundamental if you are going to design with css.
If you want to avoid a margin on your content block in which your
float sits, then you can use a left float on the content block as
well.
You need now to watch for IE doubling float margins too, these
are all horrible bugs. There are no end of tutes on these things. http://www.positioniseverything.net/...ed-margin.html
for this last.
You could read http://www.digital-web.com/articles/...andards_compli
ant_ie/
and http://www.positioniseverything.net/floatmodel.html
--
dorayme
Paul Watt wrote: The URL is: http://www.paulwatt.info/test/turn/ . and http://www.paulwatt.info/test/turn/css/turnlayout.css
All sorted now using a mix of absolute positioning and a IE browser hack! Thanks any way
How come you want me to scroll two different areas to read your content,
Paul? Your maincontent box is taller than my browser canvas, so I have
to scroll both the content div *and* the main viewport to read the
bottom of the text.
If you have a tall browser window, shorten up the height to see what I
mean.
--
-bts
-Warning: I brake for lawn deer
In article <12*************@corp.supernews.com>,
Tony <to****@dslextreme.WHATISTHIS.com> wrote: Paul Watt wrote: "Tony" <to****@dslextreme.WHATISTHIS.com> wrote in message news:12*************@corp.supernews.com...
I tried Float but it wasnt working for me, so I had to resort to position:absolute.
What happened when you used float?
I had two cells leftcell and maincontent; I had leftcell (float:left; width:250px;) and maincontent(no float,margin-left:255px;). IE and FF couldnt decide where to start counting the 255px from because leftcell was floated.
What happens if you leave off the margin-left:255px?
If he were to leave off the margin then in good and compliant
browsers the main would start at the left edge of the window,
same as with the float, and only the content would be displaced.
It is altogether better for the whole content block to be clear
of the float when you are using the float method to create
columns.
Floating for columns is a clever adaptation of the idea of
allowing text to wrap around pics, but it needs careful attention.
--
dorayme This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics
by: RyanS09 |
last post by:
Hello-
I am trying to write a snippet which will open a text file with an
integer on each line. I would like to read the last integer in the
file. I am currently using:
file = fopen("f.txt",...
|
by: Kevin Burton |
last post by:
I don't think I understand the last() function.
I have a document that looks like:
<Root>
<Header>Some text</Header>
<Message>
<MessageID>1</MessageID>
. . . .
</Message>
|
by: Carl Banks |
last post by:
Tuples will have an index method in Python 2.6.
I promise I won't indiscriminately use tuples for homogenous data.
Honest. Scout's honor. Cross my heart.
Carl Banks
|
by: mdh |
last post by:
One thing has puzzled me a while ( well, more than one thing!).
If I have a function:
foo( char *s){
char *t = s;
......
|
by: Charles Arthur |
last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
|
by: emmanuelkatto |
last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud.
Please let me know.
Thanks!
Emmanuel
|
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...
|
by: Sonnysonu |
last post by:
This is the data of csv file
1 2 3
1 2 3
1 2 3
1 2 3
2 3
2 3
3
the lengths should be different i have to store the data by column-wise with in the specific length.
suppose the i have to...
|
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...
|
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: 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...
|
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...
|
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,...
| |