Skip to main content

Forums

This topic contains 8 replies, has 0 voices, and was last updated by  flyseair 11 years, 2 months ago.

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #22792

    flyseair
    Member

    Hello Everybody!

    I would like to ask for your help on my CSS that I have based from one of the CSS-Tricks. It worked perfectly with Safari and IE, but unfortunately, it’s giving me headache when it comes to Firefox.

    Here’s the url of the problematic site: http://seairlifestyle.flyseair.com or http://www.flyseair.com.

    In Firefox, the menu gets distorted when you go to a different link, but it gets fixed when the browser is refreshed.

    I would really appreciate your help on this. Super thanks!

    Sincerely,

    Leo

    #47978

    al_m473
    Member

    This reply has been reported for inappropriate content.

    I am just trying it in FF3 and doesn’t seem to be wrong for me,
    do notice that you have no link back to the home page from any
    pages you link to.

    Al

    #47979

    Argeaux
    Participant

    i saw the bug. This is what the source looks like when the bug happens:

    Code:

As you see there are 4 a tags in the list. When the bug doesnt happen there is only one a tag in the list.

So is there some sort of php code wich produces this? And maybe its a smart idea to remove the form out the list and only put the input there. It looks a bit stuffed now. with everything in it…

#47990

flyseair
Member

Dear Argeaux and Al,

Super thank you for your reply, I really really appreciate it :D I have used WordPress and I’ve tried revising my codes, but still dame problem :( I even tried cleaning it up by removing some of the <a> tags, but the menu becomes unclickable.

Is it possible for me to take out the <form> tag yet still link the <input> to google adsense? If so, how can I do it?

As for Al, the link to the home is on the logo, but thank you for giving me your opinion :) you rock! When I’m done fixing the major problems. Actually, the book now is going to be the home, but since our booking engine is not yet in place, it the link just go to our classic booking engine.

Thank you so much guys!

#47991

flyseair
Member

Oh, I also forgot to tell, that the code for http://www.flyseair.com doesn’t work well with Opera :( Thanks!

#48024

flyseair
Member

Hi everybody!

I’ve checked on this bug and it only happens with Firefox running on Mac OSX. Please help me solve this mystery :(
This is driving me nuts. Thanks to all who replied!

Leo

#48026

Chris Coyier
Keymaster

This reply has been reported for inappropriate content.

I saw the bug too and it’s exactly as it was described above. On first load on some pages, that form element gets loaded with a bunch of extra anchor tags. You need to track down how the heck that is happening and you’ll have your answer. How is that form being added to the page?

#48046

flyseair
Member

Hallo,

Here’s the code that I used:

I. Header

<body>
<div id="page-wrap">

<div class="logo"><a title="SEAIR Home" href="/">SEAIR Logo</div>

<ul id="menu">
<li><a class="booknow" title="Book Now" href="http://secured.flyseair.com/b2c/">Book Now</a></li>
<li><a class="destinations" title="SEAIR Destinations" href="/category/destinations">Destinations</a></li>
<li><a class="routemap" title="SEAIR Routemap" href="/routemap">Route Map</a></li>
<li><a class="ourfleet" title="SEAIR Fleet" href="/ourfleet">Our Fleet</a></li>
<li><a class="timetable" title="SEAIR Timetable" href="../wp-downloads/flightsched.pdf">Timetable</a></li>
<li><a title="Coming Soon" title="Coming Soon!" class="inflightshop" href="inflightshop">InFlight Shop</a></li>
<li><a title="Search SEAIR" class="search">
<!–Search SEAIR–>
<form id="search" method="get" action="http://www.google.com/custom&quot; target="google_window">
<div align="right">
<input type="hidden" name="domains" value="flyseair.com"/>
<input type="hidden" name="client" value="pub-0240922582484691" />
<input type="hidden" name="forid" value="1" />
<input type="hidden" name="ie" value="ISO-8859-1" />
<input type="hidden" name="oe" value="ISO-8859-1" />
<input type="hidden" name="safe" value="active" />
<input type="hidden" name="safe2" value="active" />
<input type="hidden" name="cof" value="GALT:#008000;GL:1;DIV:#336699;VLC:663399;AH:center;BGC:FFFFFF;LBGC:336699;ALC:0000FF;LC:0000FF;T:000000;GFNT:0000FF;GIMP:0000FF;FORID:1;" />
<input type="hidden" name="hl" value="en" />
<input type="hidden" name="sitesearch" value="flyseair.com" />
<input name="q" type="text" class="searchtxt" value="Search Site" size="12" maxlength="255" />
<input name="image" type="hidden" id="submit" value="Search" align="top" />
</div>
</form></a></li>
</ul>

II. style.css

/*****************
Navigation
******************/
ul#menu{
list-style:none;
margin-top:40px;
}
ul#menu li{
display:inline;
}
ul#menu li a{
text-indent:-9999px;
display: block;
height:30px;
float:left;
}

ul#menu li a.booknow{
background: url(‘images/booknow.png’) no-repeat 0 -30px;
width:103px;
}

ul#menu li a.destinations{
background: url(‘images/destinations.png’) no-repeat 0 -30px;
width:112px;
}

ul#menu li a.routemap{
background: url(‘images/routemap.png’) no-repeat 0 -30px;
width:107px;
}

ul#menu li a.ourfleet{
background: url(‘images/ourfleet.png’) 0 -30px no-repeat;
width:90px;
}

ul#menu li a.timetable{
background: url(‘images/timetable.png’) 0 -30px no-repeat;
width:105px;
}

ul#menu li a.inflightshop{
background: url(‘images/inflightshop.png’) 0 -30px no-repeat;
width:116px;
}

ul#menu li a.search{
background: url(‘images/normal_07.png’) no-repeat;
width:129px;
}

ul#menu li a.booknow:hover{
background: url(‘images/booknow.png’) no-repeat;
}
ul#menu li a.destinations:hover{
background: url(‘images/destinations.png’) no-repeat;
}
ul#menu li a.routemap:hover{
background: url(‘images/routemap.png’) no-repeat;
}
ul#menu li a.ourfleet:hover{
background: url(‘images/ourfleet.png’) no-repeat;
}
ul#menu li a.timetable:hover{
background: url(‘images/timetable.png’) no-repeat;
}
ul#menu li a.inflightshop:hover{
background: url(‘images/inflightshop.png’) no-repeat;
}

.logo{
position:relative;
background-image: url(‘images/seairlogo.jpg’);
display: block;
width: 197px;
height: 90px;
top: 20px;
}

.logo a{
text-indent:-9999px;
display: block;
width: 197px;
height: 90px;
top: 30px;
}

#search{
position:relative;
padding-top:6px;
padding-right:10px;
}
#search input[type="text"]{ /*width of text boxes. IE6 does not understand this attribute*/
width: 105px;
color:#454545;
}
#search #submit{
padding-top:2px;
}

/* @end(navigation) */

/*****************
Container
******************/
#maincontent{
width:765px;
margin-top:100px;
margin-bottom:10px;
}

/*Single Posts*/
#mainsingle {
width:765px;
margin-top:100px;
margin-bottom:10px;
font: 75% "Lucida Grande", "Trebuchet MS", Verdana, sans-serif;
}
/* @end(single posts) */

/* @end(container) */



I still can’t figure out why the problem persists :(

Thanks for the reply and the help.

#48112

flyseair
Member

Really need your help :(

I have been tracing the problem and checking the cause of the codes distortion whenever it’s being run, but still no luck.
Please let me know if there’s something wrong with my code (see previous post) or is there another way of doing it more efficiently?

Thanks so much.

Viewing 9 posts - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.

icon-link icon-logo-star icon-search icon-star