Avatar billede kongensgaard Nybegynder
15. april 2005 - 09:32 Der er 1 kommentar

Margin i forbindelse med fanebladsmenu

Jeg har en faneblads menu på min testside http://new.kongensgaard.dk/chantal.php

I IE står fanebladsmenuen korrekt, men i FireFox har den rykket sig ind i forhold til left margin i #banner:
Udsnit af #banner { margin: 0px 116px 0px 114px; }

Ændrer jeg Magin står den korrekt i FireFox, men så rykker den ud under min menu i venstre side i IE.

Kan det være noget med at min menu i venstre side ikke er korrekt defineret?  IE og FireFox må jo i hvert tilfælde opfatte margin der er i #banner til at starte forskellige steder. Det må være noget med placeringen af boksene i forhold til hinanden.

Her er udsnit af CSS filen:

html,body {
    font-family: verdana, arial, sans-serif;
    color: white;
    background: url("../background/main.jpg") transparent 
        fixed left top;
    overflow: hidden;
      height: 100%;
}

#leftcol {
      width: 105px;
    float:left;
      text-align: right;
}

.leftbox {   
    width: 105px;
      float:left;
    background:transparent;
      border: 0px solid white;
      font-size: 14px;
}

#nav {
        scrollbar-face-color: #81947A;
        scrollbar-shadow-color: #61705A;
        overflow: auto;
        margin: 0px 115px 10px 10px;
        border-bottom: 1px solid white;
        border-left: 1px solid white;
        border-right: 1px solid white;
        background: #81947A;
        height: 92%;
        min-width: 425px;
}

#banner {
        overflow: hidden;
      border-top: 1px solid white;
      border-left: 1px solid white;
      border-rigth: 1px solid white;
        margin: 0px 116px 0px 114px;
      background-color: #61705A;
      color: white;
}

#banner ul {
      display: block;
      list-style: none outside;
      background-color: blue;
      padding: 0 0 0 2px;
      margin: 0 0 0 1px;
      font-size: 13px; 
      border-left: 1px solid white;
      border-bottom: 0px;
}

#banner li {
      padding: 0;
      margin: 0 3px 0 1px;
      border-top: 1px solid #81947A;
      border-right: 1px solid #81947A;
      border-left: 1px solid #81947A;
      border-bottom: 0px solid #81947A;
      background-color: #B4C3B0;
      font-weight: bold;
      display: block;
      float: left;
      position: relative;
    font-style: normal;
      top: 0.1em;
}

Link til hele CSS filen: http://new.kongensgaard.dk/style/style.css

Udsnit af http://new.kongensgaard.dk/chantal.php:

<html>
<head>

<link href="style/style.css" rel="stylesheet" type="text/css">
</head>

<body class="chantalindex">

<div id="leftcol">
    <div class="leftbox">
<?php
$menu = 2;
include("menu.php");
?>
    </div>
</div>

<div id="banner">
<ul>
<?php include("tabmenukatte.php"); ?>
</ul>
<span id="bannerclear"></span>
<br>
</div>

<div id="nav">
xxx
</div>
<div id="rightcol">
    <div class="rightbox">
      <?php
    include("nyhed1.php");
    ?>
</div>
    <br>
    <div class="rightbox2">
    <?php
    include("nyhed2.php");
    ?>
    </div>
    <br>
</div>

</body>
</html>

Kan jeg løse dette eller er jeg nødt til at rode mig ud i noget med PHP script der kan fastsætte hvilken browser brugeren anvender?
Avatar billede kongensgaard Nybegynder
15. april 2005 - 23:46 #1
Jeg fandt en workaround (baggrund for tabmenuen blev gjort transparent og det skjuler problemet).
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester