Hallo,
mein Problem ist folgendes: Wenn ich im css die ausrichtung der Internetlinks mit float: left auf links
setze bleibt eine eine ungewollte breite von 20px etwa übrig, setzte ich bei gleichen code mein float: right,
so funktionert es bestens und die links sind rechtbündig und schön kanpp am rand verstehe nicht warum.
Danke für eure Hilfe.
Hier mein html snippet;
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>Weltkarte</title>
<link href="styleWeltkarte.css" type="text/css" rel="stylesheet" />
<link href='http://fonts.googleapis.com/css?family=Oswald:400,300,700' rel='stylesheet' type='text/css'>
</head>
<body>
<script type="text/javascript" src="Wooltip/wz_tooltip.js"></script>
<div class="mainBody" >
<header class="mainHeader">
<nav>
<ul>
<li>
<a href="#">LINK 1</a>
<a href="http://www.w3schools.com/html/">LINK 2</a>
<a href="http://www.w3schools.com/html/">LINK 3</a>
<a href="http://www.w3schools.com/html/">LINK 4</a>
</li>
</ul>
</nav>
</header>
<p>
<img class="Weltkarte" src="Weltkarte.svg" alt="Karte" usemap="#Landkarte">
<map name="Landkarte">
<!-- Tooltips per JavaScript-->
<area shape="poly" coords="7,77,29,61,63,71,63,123,63,129,6,116,19,99"
href="http://www.web.de/" onmouseover="Tip('United States of America', BGCOLOR, '#FF6600',BORDERCOLOR, '#FFFFFF', FONTFACE, 'Oswald', FONTCOLOR,'#FFFFFF',FONTSIZE, '7pt', SHADOW, true, SHADOWWIDTH, 5, TEXTALIGN, 'center', WIDTH, 92)"
onmouseout="UnTip()">
</map>
</p>
</div>
</body>
</html>
Alles anzeigen
Und hier die css Datei, das Bild liefere ich nicht mit, es ist aber 800px breit
body {
font-family: 'Oswald';
background-color: #E6E6E6;
}
a {
text-decoration: none;
}
.mainBody {
width: 800px;
margin: 0 auto;
background-color: #E6E6E6;
}
.mainHeader nav {
margin-top: 2%;
background-color: #666666;
height: 30px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}
.mainHeader nav ul {
list-style: none;
margin: 0 auto;
}
.mainHeader nav ul li {
float: left; [COLOR=#ff0000][B]GENAU HIER IST DIE STELLE, DIE ICH MEINE left geht nicht, right ohne probleme[/B][/COLOR]
display: inline;
}
.mainHeader nav a:link, .mainHeader nav a:visited {
color: #FFFFFF;
display: inline-block;
padding: 3px 10px;
height: 24px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}
.mainHeader nav a:hover, .mainHeader nav a:active {
background-color: #FF6600;
}
Alles anzeigen
Danke für eure Hilfe