Få bort scroll? — webForum

Jesper TMedlem sedan nov. 20017 058 inlägg

29 mars 2004 14:17#1

Diven som heter "menu" går ner allderles för långt. Finns det ngt sätt att det inte uppkommer scroll utan att köra overflow:hidden?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="sv">
<head>

<meta http-equiv="imagetoolbar" content="no">
<title>V&auml;lkommen</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<style type="text/css">
<!--
html,body{ background:#99CCFF;height:100%;margin:0;}

body,div,span{font-family:verdana,tahoma,arial;font-size:11px;line-height:16px;}

#logo{position:absolute;left:20px;top:10px;z-index:100;cursor:pointer;}

#topnav{position:absolute;top:0px;width:100%;height:75px; border-bottom:1px solid black;z-index:10;
margin:0 105px 0 0; background:#0066FF;
}

[b]#menu{position:absolute;height:100%;left:0;top:0;bottom:0;width:105px;margin:75px 0 75px 0; border-right:1px solid black;
border-bottom:1px solid black;background-color:#cccccc;font-weight:bold;z-index:1;
}[/b]

#bottomnav{position:absolute; bottom:0px; left:105px;width:100%; height:75px; border-top:1px solid black; background:#cccccc;
margin:0 0 0 -105px;
z-index:2;
}

.menulink{padding:5px;background-color:transparent;cursor:pointer;width:90%;margin:28px 0 25px 0;}

#img{position:absolute;width:550px;height:270px;left:150px;top:120px;}

#nav{position:absolute;left:610px;top:31px;width:300px;height:40px;text-align:right;
font-weight:bold;font-size:11px;z-index:12;padding:5px;
}
-->
</style>

</head>
<body>
<div id="logo"></div>
<div id="topnav"></div>
<div id="nav">ARTISTER</div>

<div id="img"></div>

<div id="bottomnav">
<div style="padding:20px 0 0 250px;"></div>
</div>

<div id="[b]menu[/b]">
<br>
<br>
<div class="menulink" onmouseover="this.style.background='#999999'" onmouseout="this.style.background=''">Hem</div>

<div class="menulink" onmouseover="this.style.background='#999999'" onmouseout="this.style.background=''">Artister</div>

<div class="menulink" onmouseover="this.style.background='#999999'" onmouseout="this.style.background=''">Nyheter</div>

<div class="menulink" onmouseover="this.style.background='#999999'" onmouseout="this.style.background=''">Lyssna</div>

<div class="menulink" onmouseover="this.style.background='#999999'" onmouseout="this.style.background=''">Priser</div>

<div class="menulink" onmouseover="this.style.background='#999999'" onmouseout="this.style.background=''">Kontakt</div>
</div>

</body>
</html>

Jesper TMedlem sedan nov. 20017 058 inlägg

29 mars 2004 14:40#2

Ähhh det verkar vara omöjligt. Det fick bli overflow:hidden.

dectgapMedlem sedan sep. 20021 542 inlägg

29 mars 2004 14:56#3

Du kom inte fram till någon lösning på 23 minuter, och då är problemet olösligt?

Ändra #menu till

 #menu{position:absolute;height:100%;left:0;top:0;
width:105px; border-right:1px solid black;
background-color:#cccccc;font-weight:bold;z-index:1;
}

och lägg till #menuContent som child-element till #menu, fast parent till länkarna

 #menuContent{ padding: 75px 0; }

Jesper TMedlem sedan nov. 20017 058 inlägg

29 mars 2004 15:10#4

Du har rätt dectgap :r Jag var lite stressad... :OO