kan nan hitta losningen pa mitt problem?
I IE7 ligger text OM SPIRIT 2 pixlar lagre an alla andra.
Men I Firefox har jag extra rad av flickar som dyker upp.
Come on guru's!
http://www.qandgo.se/spirit_20/index.html
:( :( :(
priblem med li menu
7 svar · 716 visningar · startad av mall
ingen kan detta?
Varför har du en massa tabeller OCH en UL, tabeller är svåra att styla bra, UL lite lättare men du skulle kunna använda en div och dina <a>-taggar endast, tror du skulle få bättre överblick då.
Men för att svara på din fråga: dina <a> har fått 10px padding, plus en höjd på 36px, Det gör att varje meny-plupp blir större än vad du tänkt dig eftersom cellen vidgar sig för att få plats med det du vill.
Var dina 2px i IE7 kommer ifrån vågar jag inte spekulera i, men ta bort 2 onödiga tabeller tror jag är en början. Använd en <div> istället.
Dessutom så får man bara använda en ID en endaste gång per HTML-sida, vill du använda samma namn/typ/stil flera gånger så ska du använda class istället.
Slutligen vill jag rekomendera verktyget FireBug till Firefox, det är ett extremt kraftfullt sätt att leta fel och rätt på dina och andras sidor. Tillsammans med TIDY HTML Validator är man oslagbar :)
tack headbug, men kan du includera coden som hjalper mig rent praktiskt?
Ehrm, nej eftersom du har laddat ner en färdig meny så rekommenderar jag att du frågar på menyns egna forum där dom som utvecklar menyn kan hjälpa dig på ett bättre sätt. Din meny kommer från http://www.twinhelix.com och där finns det en länk till support-forumet (på engelska).
Gjorde om din sida lite snabbt:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<meta name="LANGUAGE" content="svenska">
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="header"></div>
<div id="navigation">
<ul id="menulist">
<li><a id="current" href="#">om spirit</a></li>
<li><a href="#">produkter</a></li>
<li><a href="#">tjänster</a></li>
<li><a href="#">kunder</a></li>
<li><a href="#">kontakt</a></li>
<li><a href="#">suport</a></li>
</ul>
<div style="clear:both;"></div>
</div>
<div id="content">
Innehåll kommer...
</div>
</body>
</html>
CSS:
* {
margin:0;
padding:0
}
BODY {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size:11px;
margin: 0px;
}
#header {
background-color: #65779d;
height: 64px;
}
#navigation {
background: url('top_nav_back.gif') repeat-x;
height: 36px;
text-align: center;
}
#menulist {
list-style: none;
margin-left:20px;
}
#menulist li {
float:left;
height:36px;
}
#menulist li a {
background: url('top_nav_menu_flik_on.gif') no-repeat;
display:block;
width:104px;
padding: 14px 0px 9px 0px;
color:#fff;
text-decoration: none;
font-variant: small-caps;
}
#menulist li a:hover {
background: url('top_nav_menu_flik_of.gif') no-repeat;
color:#000;
}
#content {
padding:10px;
}
#menulist li a#current {
background: url('top_nav_menu_flik_of.gif') no-repeat;
color:#666;
}
Förstå inte riktigt varför du har Javskriptet du just använder... vet inte om det är något du är ute efter det extra men just nu duger koden ovan anser jag.
(dock är inte menyn centerad längre).
Du är bra snäll du voigtann1 (y)
headbug skrev:
Du är bra snäll du voigtann1 (y)
Det är ju snart jul (vänta på fina klappar från Tomten i år (y) )