Welcome to WebmasterWorld Guest from 54.224.146.200

Forum Moderators: open

Message Too Old, No Replies

Opera breaks my navigation

     
8:12 pm on Mar 3, 2010 (gmt 0)

Junior Member

10+ Year Member

joined:May 18, 2005
posts: 57
votes: 0


Hello,
My website has been running for 5 years without any problems on the major browsers. The site validates to XHTML strict. Opera release 10.10 for some reason has broken my navigation and release 10.50 continues the problem. Previous versions were ok. The site is ok on IE8, Firefox, Chrome, Safari.

My navigation panel is in definition list format and has a graphic immediately below the last button. When the page is opened the graphic rides up over the nav buttons. The nav buttons show up when I hover over the graphic. I am happy to post code if that would help.
Does anyone have any idea what could be happening and what I can do about it.
Thanks for taking the time.

Regards
10:49 pm on Mar 3, 2010 (gmt 0)

Senior Member

WebmasterWorld Senior Member tedster is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:May 26, 2000
posts:37301
votes: 0


Sure - please give us a look at some code. I develop pages in Opera first - so I may well have seen whatever you are running into.

There's a thread called LINKS and posting CODE [webmasterworld.com] that offers help for how to keep code examples within our guidelines.
5:51 pm on Mar 4, 2010 (gmt 0)

Junior Member

10+ Year Member

joined:May 18, 2005
posts: 57
votes: 0


Thanks, Tedster.

I hope this helps. I have only included the basic nav code. It is served as a php include file.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">


<div id="sidebar">
<dl id="gallery">
<dd class="current">Home</dd>
<dd><a href="example.php" title="example">example</a></dd>
<dd><a href="exampleone.php" title="exampleone">exampleone</a></dd>
<dd><a href="exampletwo.php" title="exampletwo">exampletwo</a></dd>
<dd><a href="examplethree.php" title="examplethree">examplethree</a></dd>
<dd><a href="examplefour.php" title="examplefour">examplefour</a></dd>
<dd><a href="examplefive.php" title="examplefive">examplefive</a></dd>
<dd><a href="examplesix.php" title="examplesix">examplesix</a></dd>
<dd><a href="examplesevern.php" title="exampleseven">exampleseven</a></dd>
<dd><a href="exampleeight.php" title="exampleeight">exampleeight</a></dd>
<dd><a href="examplenine.php" title="examplenine">examplenine</a></dd>
<dd><a href="exampleten.html/exampleten/exampleten.php" title="exampleten">exampleten</a></dd>
</dl>

<img id="poppy" src="images1/poppy.jpg" width="148" height="198" alt="poppy" />

Thank you.

Regards
3:33 am on Mar 5, 2010 (gmt 0)

Senior Member

WebmasterWorld Senior Member tedster is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:May 26, 2000
posts:37301
votes: 0


How about the CSS rules for those IDs? and where do the divs you opened get closed?
2:45 pm on Mar 6, 2010 (gmt 0)

Junior Member

10+ Year Member

joined:May 18, 2005
posts:57
votes: 0


I have about seven different images below my navgation bar and the navigation div is closed after he last image.

CSS for the sidebar is as follows:

#sidebar {
float:left;
width:150px;
\width:170px;
w\idth:150px;
margin:0;
margin-right:0;
padding:10px;
background-color: #fff;
}

#sidebar dl{
width: 148px;
margin: 0 auto;
padding: 0;
border-left: 1px solid navy;
border-right: 1px solid navy;
border-top: 1px solid navy;
border-bottom: 1px solid navy;
}

#sidebar dd {
margin:0;
padding:0;
color: blue;
font-size: 9px;
border-top: 1px solid #fff;
background: #fff2c8;
}

#gallery a {
background: #cfd7ff url(images1/c1arrowr.gif) 5px 50% no-repeat;
color:gray;
text-decoration:none;
font-weight: normal;
display:block;
padding-left: 24px;
height: auto;
overflow: hidden;
}

#gallery a:hover {
background: #F0FFFF url(images1/c1arrowr.gif) 5px 50% no-repeat;
color:blue;
text-decoration: underline;
}

#sidebar dd.current {
padding-left: 24px;
background: #fff8dc url(images1/green1.gif) 5px 50% no-repeat;
color: navy;
}

#poppy {
border: 1px solid navy;
margin-top: 2px;
}

Thanks for your time.
4:53 pm on Mar 7, 2010 (gmt 0)

Junior Member

10+ Year Member

joined:May 18, 2005
posts:57
votes: 0


It would appear that I have solved my own problem.

<img id="poppy" src="images1/poppy.jpg" width="148" height="198" alt="poppy" />


Putting the above in a div sorted the problem but I am curious how the code [minus div] was not an issue in previous versions of the browser. Furthermore is it poor practice doing what I did previously, and not enclosing the image in a div.
Always willing to learn.
Regards
6:58 pm on Mar 7, 2010 (gmt 0)

Senior Member

WebmasterWorld Senior Member jdmorgan is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:Mar 31, 2002
posts:25430
votes: 0


So was the problem something to do with the "poppy" CSS not being applied to the "naked" <img> tag, but only when that <img> was enclosed in a div with that same id? -- A pure CSS problem, in other words?

That would imply some change in CSS inheritance behavior with the Opera 10.x release.

Curious because I always seem to be banging my head against strange CSS problems. I figure that as soon as I finally learn "the one true way" to do CSS properly --having come into the CSS game relatively late-- then I'll cease to continue running into these problems -- Well, I'm hopeful, anyway. :)

Jim
7:14 pm on Mar 7, 2010 (gmt 0)

Junior Member

10+ Year Member

joined:May 18, 2005
posts:57
votes: 0


Yes, Jim. All I did was enclose the poppy image in a div tag and nothing else was changed. I did report the original problem to Opera after 10.10 but was disappointed to see 10.50 made no difference. My concern is that I wouldn't expect new versions of a browser to break a site that was previously ok In the older versions.

Thanks
S
8:05 pm on Mar 7, 2010 (gmt 0)

Senior Member from US 

WebmasterWorld Senior Member tangor is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:Nov 29, 2005
posts:6904
votes: 379


I love it when the "it ain't broke but let's fix it anyway" crowd is involved. Sorry, not advancing the discussion, merely <rant>venting</rant>.
3:15 pm on Mar 8, 2010 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Nov 12, 2002
posts:1482
votes: 0


My concern is that I wouldn't expect new versions of a browser to break a site that was previously ok In the older versions.


One of the major changes in 10.5 was the rendering engine... didn't you see the changelog or view the announcements? And Opera sure isn't the first (or last) browser to have things render differently in different versions.