Click here to get back home

picture in navigation bar

 HomeNewsGroups | Search | About
 comp.infosystems.www.authoring.html    Post an article   get this group's latest topics as an RSS feed add this group's latest topics to your My MSN content add this group's latest topics to your My Yahoo content
Subject Author Date
picture in navigation bar Michael Jaeger 12-19-2004
Get Chitika Premium
Posted by Michael Jaeger on December 19, 2004, 6:30 pm
Please log in for more thread options
Dear ciwah,

I'm in the process of designing a German school web site, and I need the
help of you experts.

I wrote the navigation (CSS based, no javascript), which looks OK in IE,
Firefox and Opera.
Now I would like to place a picture at the outer right side of the
navigation bar, and this is where it gets tricky. I experimented with a
div container, I tried using a layer, but the design always turned out
look differently in these three browsers.
Now, must I give up the idea or has anyone of you specialists a clue as
to how to solve my problem?

I uploaded a test page including a picture to illustrate the design I
have in mind:

http://www.majaeger.de/site/test/test.htm

http://www.majaeger.de/test/style.css gives you my style sheet.

Thanks for taking your time to look into my problem,

Mike

--
~~~~~~~~~~~~~~~~~~~~~~~~~~~
http://www.majaeger.de
~~~~~~~~~~~~~~~~~~~~~~~~~~~



Posted by Lauri Raittila on December 19, 2004, 9:57 pm
Please log in for more thread options
in comp.infosystems.www.authoring.html, Michael Jaeger wrote:
> Dear ciwah,
>
> I'm in the process of designing a German school web site, and I need the
> help of you experts.
>
> I wrote the navigation (CSS based, no javascript), which looks OK in IE,
> Firefox and Opera.

That is pure luck, as you tricker quirks mode...

> Now I would like to place a picture at the outer right side of the
> navigation bar, and this is where it gets tricky. I experimented with a
> div container, I tried using a layer, but the design always turned out
> look differently in these three browsers.

Thats why it is called quirks mode.

> I uploaded a test page including a picture to illustrate the design I
> have in mind:
>
> http://www.majaeger.de/site/test/test.htm
>
> http://www.majaeger.de/test/style.css gives you my style sheet.

Use strict doctype to tricker standards mode, and put your image before
navigation menu and float it to right.

You shoudl remarkup your page, it contains all sorts of stupid things:
<h1>&nbsp;</h1>

<p class="nav">Gymnasium Burgdorf</p>

You also have marked up the second list of links as paragraph, which it
clearly is not. Use div or ul.

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>


Posted by Michael Jaeger on December 20, 2004, 5:36 pm
Please log in for more thread options
Hi Lauri,

> in comp.infosystems.www.authoring.html, Michael Jaeger wrote:
>> Dear ciwah,
>>
>> I'm in the process of designing a German school web site, and I
>> need the help of you experts.
>>
>> I wrote the navigation (CSS based, no javascript), which looks OK
>> in IE, Firefox and Opera.
>
> That is pure luck, as you tricker quirks mode...
>
>> Now I would like to place a picture at the outer right side of the
>> navigation bar, and this is where it gets tricky. I experimented
>> with a div container, I tried using a layer, but the design always
>> turned out look differently in these three browsers.
>
> Thats why it is called quirks mode.
>
>> I uploaded a test page including a picture to illustrate the design
>> I have in mind:
>>
>> http://www.majaeger.de/site/test/test.htm
>>
>> http://www.majaeger.de/test/style.css gives you my style sheet.
>
> Use strict doctype to tricker standards mode, and put your image
> before navigation menu and float it to right.

thanks for your valuable suggestions. I changed the doc type into strict
mode, but, unfortunately, this does not seem to solve my problem since
the div container placed before the navigation menu tears apart the
whole strucure. It looks awful in all three browsers :-(

> You shoudl remarkup your page, it contains all sorts of stupid
> things: <h1>&nbsp;</h1>

I know, and thanks for the remark, but this does not concern the
question at hand at the moment. I'll turn to them later, because this
page needs to be filled with information anyway.

> <p class="nav">Gymnasium Burgdorf</p>

Well, I could use "id", couldn't I?

> You also have marked up the second list of links as paragraph, which
> it clearly is not. Use div or ul.

Thanks for your help, I'll sit down now and try to make it work.

Mike

--
~~~~~~~~~~~~~~~~~~~~~~~~~~~
http://www.majaeger.de
~~~~~~~~~~~~~~~~~~~~~~~~~~~



Posted by Lauri Raittila on December 20, 2004, 8:18 pm
Please log in for more thread options
in comp.infosystems.www.authoring.html, Michael Jaeger wrote:

> thanks for your valuable suggestions. I changed the doc type into strict
> mode, but, unfortunately, this does not seem to solve my problem since
> the div container placed before the navigation menu tears apart the
> whole strucure. It looks awful in all three browsers :-(

Hm. It works just fine on Opera (7.6p4b) here. New URL?

> > <p class="nav">Gymnasium Burgdorf</p>
>
> Well, I could use "id", couldn't I?

Well, it sure looks h1 to me... Might be div too. But I wouldn't call it
paragraph...


--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>


Posted by Michael Jaeger on December 21, 2004, 5:25 pm
Please log in for more thread options
Lauri Raittila wrote:

> in comp.infosystems.www.authoring.html, Michael Jaeger wrote:
>
>> thanks for your valuable suggestions. I changed the doc type into
>> strict mode, but, unfortunately, this does not seem to solve my
>> problem since the div container placed before the navigation menu
>> tears apart the whole strucure. It looks awful in all three
>> browsers :-(
>
> Hm. It works just fine on Opera (7.6p4b) here. New URL?

Hai Lauri,

I tried a div container and a layer without success.

See the follwojg urls:

http://www.majaeger.de/site/test/testdiv.htm

http://www.majaeger.de/site/test/testlayer.htm

They look OK in the IE, but don't in Opera and Mozilla.

What did I do wrong?

>>> <p class="nav">Gymnasium Burgdorf</p>
>>
>> Well, I could use "id", couldn't I?
>
> Well, it sure looks h1 to me... Might be div too. But I wouldn't
> call it paragraph...

You're right, it's a paragraph, and I'll turn it into a list, which
seems the right choice.

I appreciate any further assistance,

Mike

--
~~~~~~~~~~~~~~~~~~~~~~~~~~~
http://www.majaeger.de
~~~~~~~~~~~~~~~~~~~~~~~~~~~



Similar ThreadsPosted
Re: Text wrapped around a picture -- picture longer than text April 27, 2008, 10:40 am
Re: Text wrapped around a picture -- picture longer than text April 27, 2008, 7:29 pm
Why IE7 not displaying picture? November 11, 2006, 9:46 pm
Multiple Links Per Picture June 16, 2005, 1:10 pm
Scrolling .jpeg picture in HTML? August 10, 2004, 6:26 am
center a picture in the middle of a paragraph December 2, 2004, 10:14 pm
counting link picture views February 16, 2005, 3:22 am
Large picture makes site too wide. July 23, 2008, 2:01 pm
Loading picture before the using java applet / progress bar or waiting message ? October 8, 2004, 12:05 am
How to divide a picture into multiple clickable parts and redirect users depending on the click? November 11, 2008, 1:10 pm

Our other projects:

Art Dolls, Fairies and Mermaids - Sunnyfaces.net

Roy's Linux, Programming and Search Engines messages

1-Script XML SitemapXML Sitemap