Knanpper skal rykkes i menubjælke
Jeg har en menubjælke:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Navigation Menu</title>
<style type="text/css">
<!--
body {
margin:0;
padding:0;
font: bold 11px/1.5em Verdana;
}
h2 {
font: bold 14px Verdana, Arial, Helvetica, sans-serif;
color: #000;
margin: 0px;
padding: 0px 0px 0px 15px;
}
img {
border: none;
}
/*- Menu Tabs 12--------------------------- */
#tabs12 {
float:left;
width:100%;
background:#F9F7F3;
font-size:93%;
line-height:normal;
border-bottom:1px solid #C2BDAE;
}
#tabs12 ul {
margin:0;
padding:10px 10px 0 100px;
list-style:none;
}
#tabs12 li {
display:inline;
margin:0;
padding:0;
}
#tabs12 a {
float:left;
background:url("tableft12.gif") no-repeat left top;
margin:0;
padding:0 0 0 4px;
text-decoration:none;
}
#tabs12 a span {
float:left;
display:block;
background:url("tabright12.gif") no-repeat right top;
padding:5px 15px 4px 6px;
color:#E4D6CD;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabs12 a span {float:none;}
/* End IE5-Mac hack */
#tabs12 a:hover span {
color:#FFF;
}
#tabs12 a:hover {
background-position:0% -42px;
}
#tabs12 a:hover span {
background-position:100% -42px;
}
#tabs12 #current a {
background-position:0% -42px;
}
#tabs12 #current a span {
background-position:100% -42px;
}
-->
</style>
body {
min-width: 550px; /* 2x LC width + RC width */
}
#container {
padding-left: 200px; /* LC width */
padding-right: 150px; /* RC width */
}
#container .column {
position: relative;
float: left;
}
#center {
width: 100%;
}
#left {
width: 200px; /* LC width */
right: 200px; /* LC width */
margin-left: -100%;
}
#right {
width: 150px; /* RC width */
margin-right: -150px; /* RC width */
}
#footer {
clear: both;
}
/*** IE6 Fix ***/
* html #left {
left: 150px; /* RC width */
}
Hvordan får jeg knapperne rykket mod højre uden der sker overflow?
