+- Sponsor-Board.de (https://www.sponsor-board.de)
+-- Forum: Community (/forumdisplay.php?fid=56)
+--- Forum: Plauderecke (/forumdisplay.php?fid=39)
+--- Thema: DIV Problem (/showthread.php?tid=9572)
DIV Problem - Miikeee - 22.01.2011 10:33
Hallo,
Da ich bin bei meiner ersten DIV Anpassung und habe folgendes Problem !
Ich will die Navi Buttons wie, Home, Vorstand etc. in die Mitte Verschieben,
wenn ich z.B padding-left: 50px; mache dann Verschiebt sich jeder Button um 50px nach rechts, also der Abstand wird bei jedem, 50px weiter gedrückt,
Wie kann ich es machen, dass sich die Buttons zusammen verschieben ?
Hoffe auf schnelle Rückmeldung,
Link: [Link: Registrierung erforderlich]
Quelltext:
PHP-Code:
<html>
<head>
<title>Rebstockhexen 2007 e.V</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body {
background-image: url(Bilder/background.jpg);
background-repeat: repeat-x;
background-color: #4e0202;
}
#page {
width: 955px;
margin-left: auto;
margin-right: auto;
}
#header {
width: 955px;
height: 170px;
background-image:url(Bilder/header.jpg);
background-repeat: no-repeat;
}
#navi {
width: 955px;
height: 93px;
background-image:url(Bilder/navi.jpg);
background-repeat: no-repeat;
}
#content {
background-image:url(Bilder/ContentUP.jpg);
background-repeat: repeat-y;
}
#contentarea {
margin-left: 15px;
padding-top: 15px;
}
#footer {
width: 955px;
height: 97px;
background-image:url(Bilder/footer.jpg);
}
.buttonclass {
float: left;
padding-left:;
padding-top: 53px;
}
-->
</style>
</head>
<body>
<div id="page">
<div id="header"></div>
<div id="navi">
<div class="buttonclass" id="Home"><img src="Bilder/navigation_09.jpg" width="72" height="37" alt="Home"></div>
<div class="buttonclass" id="Vorstand"><img src="Bilder/navigation_10.jpg" width="83" height="37" alt="vorstand"></div>
<div class="buttonclass" id="Geschichte"><img src="Bilder/navigation_11.jpg" width="72" height="37" alt="geschichte"></div>
<div class="buttonclass" id="Termine"><img src="Bilder/navigation_12.jpg" width="72" height="37" alt="Termine"></div>
<div class="buttonclass" id="Bilder"><img src="Bilder/navigation_13.jpg" width="72" height="37" alt="Bilder"></div>
<div class="buttonclass" id="Gästebuch"><img src="Bilder/navigation_14.jpg" width="72" height="37" alt="Gästebuch"></div>
<div class="buttonclass" id="Links"><img src="Bilder/navigation_15.jpg" width="72" height="37" alt="Links"></div>
</div>
<div id="content">
<div id="contentarea">
<div id="titel">Herzlich Willkommen</div>
<div id="text">Hier wird Später der Willkommens Text stehen, :D</div>
</div>
</div>
</div>
<center>
<div id="footer"></div>
</center>
</body>
</html>
MFG
RE: DIV Problem - Jan - 22.01.2011 10:40
Möglichkeit 1:
Div Drumrumziehen, den align:center; setzen. Sehe aber, dass du in der Navi Bilder vom Header weiterführen willst. Zum genaueren Justieren würde ich ...
Möglichkeit 2:
... einen weiteren DIV Container neben den Linken NaviPunkt setzen, dem die Höhe von 1px geben, Hintergrund natürlich transparent, und die Breite so setzen, dass alles passt
Sollten noch Fragen aufkommen, kannst du sie gerne stellen
RE: DIV Problem - Sysix - 22.01.2011 11:05
bei der id navi musst du padding hinzufügen
RE: DIV Problem - Miikeee - 22.01.2011 11:20
danke, habe es so gemacht wie Sysix es gesagt hat,
Danke ;
MFG
RE: DIV Problem - Jan - 22.01.2011 12:48
Mhm, Padding benutze ich persönlich eher ungern, da der IE das manchmal fehlinterpretiert ...
RE: DIV Problem - Sysix - 22.01.2011 13:36
Jan bin da genau andere meinung, margin geht bei ie nicht^^
RE: DIV Problem - aether - 22.01.2011 13:52
Sysix schrieb:
Jan bin da genau andere meinung, margin geht bei ie nicht^^
Bin da auch deiner Meinung, bei Margin verbuggt es extrem...
Lieber drauf verzichten 
RE: DIV Problem - JeyP - 22.01.2011 13:52
Sysix schrieb:
Jan bin da genau andere meinung, margin geht bei ie nicht^^
Yop, habe auch gelernt das man immer Padding anstatt Margin nehmen soll, wenn es geht. Margin macht in älteren Browsern öfters Probleme!
RE: DIV Problem - Miikeee - 22.01.2011 13:53
ehm nächstes Problem, unten am Footer die Schriften Startseite etc. sind die bei euch auch blau ?
Wenn ja wie bekomm ich das weg ?
MFG
RE: DIV Problem - aether - 22.01.2011 13:57
Einfach mit color wenn du immer diese Schriftfarbe haben willst, anonsten mit a:link etc...
RE: DIV Problem - ~Chris~ - 22.01.2011 14:09
mach mal
Code:
img { border: none; }
Dann sind die Linien um der Navi weg
Andere Frabe für Links + Unterstreichung weg
Code:
a {
text-decoration: none;
color: #frabe;
}
Andere Farbe wenn man über den Link geht
Code:
a:hover { color: #farbe; }
RE: DIV Problem - Sysix - 22.01.2011 15:14
Chris wenn dan nur bei verinken
Code:
a.img { border:none; }
oder
Code:
img a {border:none; ]
denke das beide gehen
Für dein Footer:
Code:
.footerclass a, .footerclass a:hover, .footerclass a:active, .footerclass a:visited { deine einstellungen, wie farbe größe etc}
MFG Sysix
RE: DIV Problem - ~Chris~ - 22.01.2011 15:29
geht aber auch ohne dem a
RE: DIV Problem - Miikeee - 22.01.2011 16:25
so nochmal ich, da ich jetzt alles auf alle Browser Optimiert habe ist mir aufgefallen das ich ja die GANZE Page Vermittelt habe und somit auch den Contenttext !
[Link: Registrierung erforderlich]
Wie bekomme ich jetzt denn Content Text wieder nach Links wie es in der Stylesheet steht ?
MFG
RE: DIV Problem - ~Chris~ - 22.01.2011 16:46
so:
Code:
#contentarea {
margin-left: 15px;
padding-top: 15px;
text-align: left;
}
RE: DIV Problem - Miikeee - 22.01.2011 16:47
Danke, jetzt habe ich noch nachträglich einen Strich ausgelslicet der soll den Content Teilen 2/3 Content 1/3 Galerie ?
Wies ihr wie ich das mit Div mache,
MFG
RE: DIV Problem - Miikeee - 22.01.2011 19:41
Neues Problem !
[Link: Registrierung erforderlich]
Wie bekomme ich es auf die slebe höhe also, Bild Strich und Text ?
MFG
RE: DIV Problem - Miikeee - 23.01.2011 19:51
so, also nächstes Problem, und auch letztes !
Wie bekomme ich alles was im Content ist auf die selbe höhe, das heißt Strich
Text und Bild ?
[Link: Registrierung erforderlich]
MFG