This is Interesting: Free Magazines for Graphics designers and webmasters  


Home > Archive > Dreamweaver > February 2006 > different position of divs in Firefox





You are viewing an archived Text-only version of the thread. To view this thread in it's original format and/or if you want to reply to this thread please [click here]

Author different position of divs in Firefox
eppo747

2006-02-12, 6:36 pm

Hi,

If you have a look at www.burokop.nl/KOP_cards.htm you'll find the text of the
tabs on the right (below) out of position in Firefox but not in IE. How come?

The stylesheet: http://www.burokop.nl/BKstylesheets/basiclayout1.css

thanks. Erwin

Murray *TMM*

2006-02-12, 6:36 pm

Want to see something worse? Make Firefox display your text a few sizes
larger. That's what happens when you use layers for containing text the way
you have. In fact, your use of layers for positioning everything on the
page is the source of your tab problems, too. I can't say exactly why this
is the case, but look at the space between the bottom of the green area
under the bar code, and the top of the letters in the tabs - it's about 10px
greater in FF than in IE, which is why the letters appear lower in FF.

On closer inspection, I'll bet what you are seeing is the margin above the
<ul> in the #navbottom div, and the margin above the <p> in the #navtablow2
div. Try controlling those, and I'll bet things come into line - at least
until you resize your text....

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com - Template Triage!
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
==================


"eppo747" <webforumsuser@macromedia.com> wrote in message
news:dsf797$a0p$1@forums.macromedia.com...
> Hi,
>
> If you have a look at www.burokop.nl/KOP_cards.htm you'll find the text of
> the
> tabs on the right (below) out of position in Firefox but not in IE. How
> come?
>
> The stylesheet: http://www.burokop.nl/BKstylesheets/basiclayout1.css
>
> thanks. Erwin
>



eppo747

2006-02-12, 6:37 pm

Hi Murray, thanks for your comment. I am going to look into it right away and
see if I can solve it. In the meantime could you advise me on the text size
issue. Should I create a scrollbar when the text size is increased? It doesn't
seem like a pretty solution to me, but it will probably work. How would you
solve this otherwise? Erwin

Murray *TMM*

2006-02-12, 6:37 pm

> How would you
> solve this otherwise?


Unfortunately for you, I would solve it by not using layers the way you
have. Your page is a "poster child" for the evils of using absolute
positioning as an exclusive layout method. The problem with such absolutely
positioned things is that EACH one is unaware of what is happening on the
rest of the page, unline a table, for example, where changes in one cell can
affect every other cell on the page. So, when one layer expands, it does
not push other layers out of the way.

The solution is to lock notions of absolute positioning away in the dust bin
until you REALLY understand how to lay out a page without it. Your page
would not require a single absolutely positioned element to implement.

However, I am guessing that this is the start of a really long thread,
because your next question would be "OK - how do I do it without layers,
then?", and that answer is not something easily done in a sentence or two.

Give me some time and I'll try to throw together an example of how I'd do
your layout....

Anyone want to help? 8)

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com - Template Triage!
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
==================


"eppo747" <webforumsuser@macromedia.com> wrote in message
news:dsfev2$kn1$1@forums.macromedia.com...
> Hi Murray, thanks for your comment. I am going to look into it right away
> and
> see if I can solve it. In the meantime could you advise me on the text
> size
> issue. Should I create a scrollbar when the text size is increased? It
> doesn't
> seem like a pretty solution to me, but it will probably work. How would
> you
> solve this otherwise? Erwin
>



eppo747

2006-02-12, 6:37 pm

I expected something like that....;( I am running into a lot of troubles and
stuff I don't know anything or not enough about. To prevent me from getting
more bumps on my head and matching dents on my desk, I started a course in
webdesign just yesterday which will continue for a while. So I hope to learn a
lot more. In the meantime I would really appreciate learning your view on
building my site. It would be a challenge to rebuild it with your indications
(and those of others ofcourse) during the course. So a 'Murray: that's the way
I'd do it' would be more than welcome. Thanks, I really appreciate everybody's
help. I am not depressed...yet. Erwin

Murray *TMM*

2006-02-12, 6:40 pm

Take a look here -

http://murraytestsite.com/BuroKop/KOP_cardsgws.htm

There are two major problems with layouts like this -

1. Matching the heights of the two white panels in the body content
2. Text overflowing this rigid layout when it is enlarged

You can see the latter happening in FF or IE when you make your text larger.

Note that I have not finished the menu buttons with the tabbed background.

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com - Template Triage!
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
==================


"eppo747" <webforumsuser@macromedia.com> wrote in message
news:dsfhqj$onu$1@forums.macromedia.com...
>I expected something like that....;( I am running into a lot of troubles
>and
> stuff I don't know anything or not enough about. To prevent me from
> getting
> more bumps on my head and matching dents on my desk, I started a course in
> webdesign just yesterday which will continue for a while. So I hope to
> learn a
> lot more. In the meantime I would really appreciate learning your view on
> building my site. It would be a challenge to rebuild it with your
> indications
> (and those of others ofcourse) during the course. So a 'Murray: that's
> the way
> I'd do it' would be more than welcome. Thanks, I really appreciate
> everybody's
> help. I am not depressed...yet. Erwin
>



eppo747

2006-02-16, 6:38 pm

Hi Murray, thanks for your efforts. I do understand the consequense of the
layout I've chosen. It's a bit of a fight between design on one hand and
technique and user friendliness on the other. I would really like to stick to
the design wihout wanting to loose user friendliness and technical feasibility.
In my opinion that leaves me with basically 3 things I can do:

1 - Make images of everything including text (technically easy, not so user
friendly)
2 - Make the tabs images and put a subtle scroll-bar in at least the left
textlayer when he text is enlarged. (technically feasible? and user friendly)
3 - Just leave it and hope there will not be too many users enlarging the text
(technically super easy, not user friendly at all)

I would really prefer the second option. The layout would not have to suffer
that much and the user can enlarge the text without it falling off.

My guess is you would go for the design with keeping the technique in the back
of your mind which would eventually never lead to a layout like mine. Right?
So, your favourite option will probably not be listed in the above mentioned
options.

However, me wanting to push it through I would like to know if you think the
second option is a good alternative in my case?
- If yes, would you know how I can make or download a scrollbar which would
fit nicely in my design? (that is, not the big blue scroll bar).
- If no, would you be able to come up with any other alternatives or don't you
feel like feeding my project anymore as you can no longer support the 'design
side' I am on? (In which case I would not be offended in any way)

Looking forward to your reaction. Erwin





Murray *TMM*

2006-02-16, 6:38 pm

Erwin:

I understand your predicament.

Of the three options below, #1 isn't really even an option, since it would
be not only user unfriendly, but also would impact your site's access to
search engine ranking.

#2 is your best option, although I detest it. Confining your important text
to a tiny little scrolling area on the page, with oodles of available space
is a blatant sacrifice of function for design. As for subtle scrollbars,
they just don't exist. You get the one that the system gives you.

#3 is an ostrich approach - think of the positive impact of your design
balanced against the negative impact of a single (potentially important)
prospective client who enlarges the text. I wouldn't do it.

Unfortunately, the current design offers no other alternatives that I can
think of. Trying to fit text into the envelope of an inflexible background
image will always be a sub-optimal choice.

There is, however, one possiblity - but it requires a bit of fiddling to
make work. Take a look at
http://neapco.beyondunreal.com/film...layouttest.html and see if you can
figure out how I did that....

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com - Template Triage!
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
==================


"eppo747" <webforumsuser@macromedia.com> wrote in message
news:dspsm8$ico$1@forums.macromedia.com...
> Hi Murray, thanks for your efforts. I do understand the consequense of the
> layout I've chosen. It's a bit of a fight between design on one hand and
> technique and user friendliness on the other. I would really like to stick
> to
> the design wihout wanting to loose user friendliness and technical
> feasibility.
> In my opinion that leaves me with basically 3 things I can do:
>
> 1 - Make images of everything including text (technically easy, not so
> user
> friendly)
> 2 - Make the tabs images and put a subtle scroll-bar in at least the left
> textlayer when he text is enlarged. (technically feasible? and user
> friendly)
> 3 - Just leave it and hope there will not be too many users enlarging the
> text
> (technically super easy, not user friendly at all)
>
> I would really prefer the second option. The layout would not have to
> suffer
> that much and the user can enlarge the text without it falling off.
>
> My guess is you would go for the design with keeping the technique in the
> back
> of your mind which would eventually never lead to a layout like mine.
> Right?
> So, your favourite option will probably not be listed in the above
> mentioned
> options.
>
> However, me wanting to push it through I would like to know if you think
> the
> second option is a good alternative in my case?
> - If yes, would you know how I can make or download a scrollbar which
> would
> fit nicely in my design? (that is, not the big blue scroll bar).
> - If no, would you be able to come up with any other alternatives or don't
> you
> feel like feeding my project anymore as you can no longer support the
> 'design
> side' I am on? (In which case I would not be offended in any way)
>
> Looking forward to your reaction. Erwin
>
>
>
>
>



Murray *TMM*

2006-02-16, 6:39 pm

Yes. That's how I did it. The code is all on the page for you to
examine.... 8)

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com - Template Triage!
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
==================


"JimmyRiddle99" <jimr99@hotmail.com> wrote in message
news:dsq9np$7n4$1@forums.macromedia.com...
> Sorry to butt in...
>
> Just checked the link Murray. Have you just used background images in
> maybe 1 or more centre aligned divs?
>



JimmyRiddle99

2006-02-16, 6:39 pm

Sorry to butt in...

Just checked the link Murray. Have you just used background images in maybe
1 or more centre aligned divs?


eppo747

2006-02-16, 6:40 pm

Hi Murray,

I just had a quick look at the link you posted. I see the repeat/no-repeat
background image approach. It is a nice solution, but unfortunately not for my
fixed size layers. I see there is no real other option for me at this moment
than to leave it like it is or change the design a little. I'm going to think
and talk it over for a while and then see what I do. In the meantime and maybe
as a last question regarding this site I would like to come back on a comment
you made about my page not needing any absolute positioned layers. From my
(design) point of view using the absolute positioned divs was the only option,
right?
Regards, Erwin

Sponsored Links


Copyright 2003 - 2008 forum4designers.com  Software forum  Computer Hardware reviews