Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > Left padding and IE

Reply
Thread Tools

Left padding and IE

 
 
geniolatenio
Guest
Posts: n/a
 
      03-03-2006
Hello guys, I have a rather strange problem with IE (googled for it to
no avail)

I have these two styles in the css file, right?

#menu { left:13px; padding:13px 0 14px 247px; white-space:nowrap }

#menu a { padding:13px 11px 13px 11px }

(I have removed some items that are not relevant to the problem)

The menu DIV contains some anchors, it's something like

<div id="menu">
<a href="">1</a>
<a href="">2</a>
</div>

Now, everything's fine in firefox and opera, if I resize the window
the menu will stay where it has to stay.
When I test it in IE, though, the menu "flips down" for some unknown
reason. Here's the snapshot of both browsers, where you can see that
IE pushes down the menu when resizing the window.

http://incarta.altervista.org/problem1.gif

So I put the "height:13px" in the #menu style. The problem now
changes:

this is when window is fully open:
http://incarta.altervista.org/ie_normal.gif

this is when window has been resized:
http://incarta.altervista.org/ie_resize.gif

That's a 16px difference!

My solution was to put an invisible element <span
id="invisible">X</span> before the first <a> tag and it worked. But I
think this is not the correct solution.

What's the right way to fix this problem? Or is it a problem that IE
has so any workaround will do?

Thanx everybody!

geniolatenio

Bye

geniolatenio
 
Reply With Quote
 
 
 
 
geniolatenio
Guest
Posts: n/a
 
      03-05-2006
So.. no one can solve this problem?

I thought you all were kind of css gurus here..

Bye

geniolatenio
 
Reply With Quote
 
 
 
 
dorayme
Guest
Posts: n/a
 
      03-05-2006
In article <(E-Mail Removed)>,
geniolatenio <(E-Mail Removed)> wrote:

> So.. no one can solve this problem?
>
> I thought you all were kind of css gurus here..
>
> Bye
>
> geniolatenio


what problem?

--
dorayme
 
Reply With Quote
 
Adrienne Boswell
Guest
Posts: n/a
 
      03-06-2006
Gazing into my crystal ball I observed geniolatenio
<(E-Mail Removed)> writing in
news:(E-Mail Removed):

> Hello guys, I have a rather strange problem with IE (googled for it to
> no avail)
>
> I have these two styles in the css file, right?
>
> #menu { left:13px; padding:13px 0 14px 247px; white-space:nowrap }
>
> #menu a { padding:13px 11px 13px 11px }
>
> (I have removed some items that are not relevant to the problem)
>
> The menu DIV contains some anchors, it's something like
>
><div id="menu">
> <a href="">1</a>
> <a href="">2</a>
></div>
>
> Now, everything's fine in firefox and opera, if I resize the window
> the menu will stay where it has to stay.
> When I test it in IE, though, the menu "flips down" for some unknown
> reason. Here's the snapshot of both browsers, where you can see that
> IE pushes down the menu when resizing the window.
>
> http://incarta.altervista.org/problem1.gif
>
> So I put the "height:13px" in the #menu style. The problem now
> changes:
>
> this is when window is fully open:
> http://incarta.altervista.org/ie_normal.gif
>
> this is when window has been resized:
> http://incarta.altervista.org/ie_resize.gif
>
> That's a 16px difference!
>
> My solution was to put an invisible element <span
> id="invisible">X</span> before the first <a> tag and it worked. But I
> think this is not the correct solution.
>
> What's the right way to fix this problem? Or is it a problem that IE
> has so any workaround will do?
>
> Thanx everybody!
>


It would help if you would also provide a URL. There may be other problems
not seen here that could be in the source.

--
Adrienne Boswell
http://www.cavalcade-of-coding.info
Please respond to the group so others can share
 
Reply With Quote
 
geniolatenio
Guest
Posts: n/a
 
      03-06-2006
On Mon, 06 Mar 2006 00:07:49 GMT, Adrienne Boswell
<(E-Mail Removed)> wrote:

>It would help if you would also provide a URL. There may be other problems
>not seen here that could be in the source.


Ok, so here's the url http://incarta.altervista.org/indextemp.html (i
haven't uploaded the img folder so you won't see the images, don't
think that's a problem). The html up there is the one with my
temporary fix (read below). To reproduce the error, just remove the
<span id="invisible">X</span> in the html body.

And I re-post the problem for those who didn't read it..

Thanks a lot!

-----------------------------------

Hello guys, I have a rather strange problem with IE (googled for it to
no avail)

I have these two styles in the css file, right?

#menu { left:13px; padding:13px 0 14px 247px; white-space:nowrap }

#menu a { padding:13px 11px 13px 11px }

(I have removed some items that are not relevant to the problem)

The menu DIV contains some anchors, it's something like

<div id="menu">
<a href="">1</a>
<a href="">2</a>
</div>

Now, everything's fine in firefox and opera, if I resize the window
the menu will stay where it has to stay.
When I test it in IE, though, the menu "flips down" for some unknown
reason. Here's the snapshot of both browsers, where you can see that
IE pushes down the menu when resizing the window.

http://incarta.altervista.org/problem1.gif

So I put the "height:13px" in the #menu style. The problem now
changes:

this is when window is fully open:
http://incarta.altervista.org/ie_normal.gif

this is when window has been resized:
http://incarta.altervista.org/ie_resize.gif

That's a 16px difference!

My solution was to put an invisible element <span
id="invisible">X</span> before the first <a> tag and it worked. But I
think this is not the correct solution.

What's the right way to fix this problem? Or is it a problem that IE
has so any workaround will do?

Bye

geniolatenio
 
Reply With Quote
 
geniolatenio
Guest
Posts: n/a
 
      03-07-2006
So this left padding problem with IE, in the end, IS too complicated
even for you guys.. damn.. I'm fuxxed!

Bye

geniolatenio
 
Reply With Quote
 
Beauregard T. Shagnasty
Guest
Posts: n/a
 
      03-07-2006
geniolatenio wrote:

> So this left padding problem with IE, in the end, IS too complicated
> even for you guys.. damn.. I'm fuxxed!


I don't see a problem. No, it is not too complicated.

http://k75s.home.att.net/show/geniolatenio.jpg

...though I would not do the layout as you are. I would use em instead of
px for just about every measurement in your style sheet. And I would
drop Verdana; google for the reasons. I would also set the font size to
100%.

--
-bts
-Warning: I brake for lawn deer
 
Reply With Quote
 
geniolatenio
Guest
Posts: n/a
 
      03-08-2006
On Tue, 07 Mar 2006 14:30:24 GMT, "Beauregard T. Shagnasty"
<(E-Mail Removed)> wrote:

>geniolatenio wrote:
>
>> So this left padding problem with IE, in the end, IS too complicated
>> even for you guys.. damn.. I'm fuxxed!

>
>I don't see a problem. No, it is not too complicated.


that's the "fixed" version, the one with the workaround.. here, i've
uploaded the "not working" version here..
http://incarta.altervista.org/indexok.html

but at this point I suppose it really is an IE problem..no one can
solve it

>..though I would not do the layout as you are. I would use em instead of
>px for just about every measurement in your style sheet. And I would
>drop Verdana; google for the reasons. I would also set the font size to
>100%.


mmm.. may I ask you why not the px? The menu has to be that size, I'm
using pixels only for the menu because if I let the user change the
size it'll screw the layout..

Bye

geniolatenio
 
Reply With Quote
 
Beauregard T. Shagnasty
Guest
Posts: n/a
 
      03-08-2006
geniolatenio wrote:

> On Tue, 07 Mar 2006 14:30:24 GMT, "Beauregard T. Shagnasty"
> <(E-Mail Removed)> wrote:
>
>>geniolatenio wrote:
>>
>>> So this left padding problem with IE, in the end, IS too complicated
>>> even for you guys.. damn.. I'm fuxxed!

>>
>> I don't see a problem. No, it is not too complicated.

>
> that's the "fixed" version, the one with the workaround.. here, i've
> uploaded the "not working" version here..
> http://incarta.altervista.org/indexok.html


This link looks the same to me, in Firefox and IE6.

> but at this point I suppose it really is an IE problem..no one can
> solve it


That old browser has lots of problems, eh?

>> ..though I would not do the layout as you are. I would use em instead
>> of px for just about every measurement in your style sheet. And I
>> would drop Verdana; google for the reasons. I would also set the
>> font size to 100%.

>
> mmm.. may I ask you why not the px?


IE users with vision problems will not be able to resize it, so they can
read it, when px (or pt) is used. If you use percentages (or em), they
will be able to resize ... (and even with px, users of all modern
browsers can resize - Firefox: press Control-Plus a few times)

> The menu has to be that size, I'm using pixels only for the menu
> because if I let the user change the size it'll screw the layout..


...then the rest of the design is wrong, too. Google for liquid or fluid
design. Zillions of pages, including this very good one:

http://www.xs4all.nl/~sbpoley/webmat...lexdesign.html

--
-bts
-Warning: I brake for lawn deer
 
Reply With Quote
 
josh
Guest
Posts: n/a
 
      03-08-2006
It appears to be the left and right padding and border you have given
to the #menu a, #menu a:hover, #menu a.acceso that is causing the
problem

 
Reply With Quote
 
 
 
Reply

Thread Tools

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

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
left-padding ints Ike Java 3 09-08-2005 12:07 AM
How do I do a layout with 100% width minus padding on left and right? Tony M HTML 5 09-07-2005 10:48 PM
Remove left and top padding from IFRAME in a cell? FingersMeArse Javascript 1 12-01-2004 07:04 PM
padding left-justified string fields Dave Perl 7 07-22-2004 09:55 AM
How to align table with some left padding? RA ASP .Net 1 02-19-2004 06:25 PM



Advertisments