CSS issue for google chrome update

Question

i had no problem with my topmenu until the recent google chrome update

Now since it updated, the last item (only the last one) on the top menu goes onto the next line.

Any ideas why that might be?

Here is the code:

    /* TopMenu 
    ---------------*/
    #topmenu {
      float:right;
      margin:6px 15px 0}

  #topmenu ul.menu { 

margin:0;
padding:0;}
#topmenu ul.menu li {

  display:inline;
  float:left;
  padding:0 1.1em 0 0;
  border-right:1px dotted #555;
  margin:0 0 0 1.1em;
  text-shadow: 1px 1px 1px #FFFFFF;
  list-style-type:none;}
  #topmenu ul.menu li a {
    border-bottom:1px dotted rgba(0,0,0,0);
    color: #3F5868;
      padding-bottom: 2px;}
    #topmenu ul.menu li.active a,
    #topmenu ul.menu li a:hover {
      color:#000;
      border-bottom-color:rgba(0,0,0,0);
      text-decoration:none;}

  #topmenu ul.menu li a img {
    float:left;
    margin:0px 8px -4px 0}

  #topmenu ul.menu li:last-child {
    border:none;
    padding-right:0;}

Answer 1

I noticed the issue on the site in Chrome, but it looks like you are actively trying to resolve the issue yourself, which makes it hard for me to see what is going on with the menu. If you don't anticipate changing the content in the menu, you could easily solve this issue by giving #topmenu a width of roughly 300px. Otherwise, I'm going to assume it is an issue with padding.

Answer 2

I'm using the latest version of Chrome and the last item in the #topmenu nav at www.housemarket.ie is inline with the rest of the menu items. For some reason, however, it's just a bullet, but when I change the bullet to filler text in the inspector it stays on the same line. Maybe try refreshing your browser's cache?