HighDots Forums  

Div border that looks the same in IE and Firefox?

Cascading Style Sheets Layout/presentation on the WWW (comp.infosystems.www.authoring.stylesheets)


Discuss Div border that looks the same in IE and Firefox? in the Cascading Style Sheets forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
OBAFGKM_RNS@yahoo.com
 
Posts: n/a

Default Div border that looks the same in IE and Firefox? - 09-24-2007 , 07:07 PM






All i want to do is draw a simple rectangle. The rectangle has to be
the same size in IE and Firefox.

This is how I tried:
<div style="position: absolute; z-index: 1; width: 438; height:
318; top: 77; left: 200; padding: 0; border: red 1px solid;"></div>

Firefox will draw a 438x318 area with a red box around it.
IE will draw a 436x316 area with a red box around it, making the
overall rectangle 438x318.

How can I get it to look the same in both of these browsers??


Reply With Quote
  #2  
Old   
Jonathan N. Little
 
Posts: n/a

Default Re: Div border that looks the same in IE and Firefox? - 09-24-2007 , 09:32 PM






OBAFGKM_RNS (AT) yahoo (DOT) com wrote:
Quote:
All i want to do is draw a simple rectangle. The rectangle has to be
the same size in IE and Firefox.
URL?

What's your doctype? I could make a difference...

Quote:
This is how I tried:
div style="position: absolute; z-index: 1; width: 438; height:
^^^
318; top: 77; left: 200; padding: 0; border: red 1px solid;"></div
^^^ ^^ ^^^

Well your try was not good enough. 438 what? Pixels, feet, parsecs (real
bigums)? With CSS lengths!=0 require* units specified. (*just a couple
of exceptions)


--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com


Reply With Quote
  #3  
Old   
OBAFGKM_RNS@yahoo.com
 
Posts: n/a

Default Re: Div border that looks the same in IE and Firefox? - 09-24-2007 , 09:57 PM



Thanks for replying, Jonathan.

I dont have any doctype specified, and there is no url yet, because
I've just started working on this particular page and it is stored
locally on my hard drive. Also, without specifying pixels, i've always
found that pixels are implied (i'm not certain about that though).
Even with this problem, both IE and Firefox are using pixels.

THIS IS THE PROBLEM:
When Firefox is told to create a div with a border around it, it does
just that. It adds the border around the OUTSIDE of the div. IE on the
other hand, will create a div with the border on the INSIDE of the
div. The net result will always be that the box will be different
sizes in those 2 browsers. I am using the latest version of both
browsers. There must be a solution (hopefully a simple one).


On Sep 24, 10:32 pm, "Jonathan N. Little" <lws4... (AT) centralva (DOT) net>
wrote:
Quote:
OBAFGKM_... (AT) yahoo (DOT) com wrote:
All i want to do is draw a simple rectangle. The rectangle has to be
the same size in IE and Firefox.

URL?

What's your doctype? I could make a difference...



This is how I tried:
div style="position: absolute; z-index: 1; width: 438; height:

^^^> 318; top: 77; left: 200; padding: 0; border: red 1px solid;"></div

^^^ ^^ ^^^

Well your try was not good enough. 438 what? Pixels, feet, parsecs (real
bigums)? With CSS lengths!=0 require* units specified. (*just a couple
of exceptions)

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIOhttp://www.LittleWorksStudio.com



Reply With Quote
  #4  
Old   
dorayme
 
Posts: n/a

Default Re: Div border that looks the same in IE and Firefox? - 09-25-2007 , 06:48 PM



In article
<1190761276.773972.209400 (AT) g4g2000hsf (DOT) googlegroups.com>,
OBAFGKM_RNS (AT) yahoo (DOT) com wrote:

Quote:
Sorry about the top posting. I never knew that people actually
preferred scrolling thru old text to get to the new stuff. I thought i
was making it easier to read.
If you had edited the text quoted, there would have only been the
must read first text there and so the question of preference
would be self evident.

--
dorayme


Reply With Quote
  #5  
Old   
Jonathan N. Little
 
Posts: n/a

Default Re: Div border that looks the same in IE and Firefox? - 09-25-2007 , 07:14 PM



OBAFGKM_RNS (AT) yahoo (DOT) com wrote:
<snip>

Quote:
Sorry about the top posting. I never knew that people actually
preferred scrolling thru old text to get to the new stuff. I thought i
was making it easier to read.
We don't! <snip> out bits that your are not commenting on like this...
Quote:
Anyway, all is working fine now. I also didnt realize before last
night that adding the doctype to the head of the file actually
prevents bugs in IE. This maybe could have saved me many hours of
torture in the past.
(And interject comments as I am doing here rather than all at the bottom)

It *can* prevent trigging quirks mode but does not guarantee it.

Quote:
There are no errors in my markup. The problem is still, as i've stated
a few times now, that IE by default, draws a div border INSIDE the
div. Firefox draws it around the outside.
IE does not draw it inside if it's not in quirks mode. My guess is your
still have errors. URL???

How you know there are no errors? Did you validate it?

Quote:
As far as not specifying pixels. Anytime that i've created a div, and
not specified units, 100% of the time it created it using pixels. If i
create a div like this: <div style="with: 200; height: 300;...>, every
time a div 200px x 300px will be created. Maybe i've just been lucky.
Are you sure? With which browser*s* not just MSIE.

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com


Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.