Brauche Hilfe bei meiner Webseite!

T

Tobi24

Aktives Mitglied
Thread Starter
Dabei seit
03.02.2005
Beiträge
787
Reaktionspunkte
13
hallo!

ich habe mal folgenden link zum testen eines neuen webseiten-deigns eingerichtet:

http://www.billyboyz.de/new/probe.html

das eigentliche bild habe ich erstmal schwarz gemacht. es geht ja auch um was ganz anderes:

1) die navi soll stets über dem rechten oberen teil des kastens stehen und auch dort bleiben, egal, wie ich das browserfenster vergrößere/verkleinere. im moment schiebt sie sich entlang der oberen fensterkante! was mache ich falsch?

2) die aufteilung sollte IMMER (egal welche monitorgröße/auflösung) fest bleieben. also der kasten in der mitte des bildes.

3) ich möchte im gesamtbrowserfenster keine scrollbalken!

veielen dank für alle eure hilfe!
 
Ich würd das Grundgerüst komplett anders machen.

Hier der Code dazu:
Code: 
<!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>blablablablubb</title>


<style>
* {
margin:  0;
padding: 0;
list-style: none;
}

html, body {
height:100%;
}

#distance { 
width:1px;
height:50%;
margin-bottom: -275px;
float:left;
}

#wrapper {
margin: auto;
position: relative;
text-align: left;
width: 650px;
clear: left;
}

#content {
width: 650px;
height: 500px;
border: 1px solid black;
}


#menu {
margin: auto;
position: relative;
height: 30px;
width: 650px;
}

ul {
list-style-type:none;
display: block;
}

#menu ul {
float: right;
}


#menu li {
float: left;
margin-left: 20px;
}


</style>

</head>
<body>

<div id="distance"></div>

<div id="wrapper">
<div id="menu">
<ul>
<li><a href=#>news</a></li>
<li><a href=#>bla</a></li>
<li><a href=#>info</a></li>
<li><a href=#>bla</a></li>
<li><a href=#>termine</a></li>
<li><a href=#>g&auml;ste</a></li>
</ul>
</div>	

<div id="content">
Inhalt (iFrame etc)
</div> 
	
</div>

</body>
</html>

Erklärungen zu dein einzelnen Elementen findest du bei http://de.selfhtml.org
unter CSS und HTML.
 
Zuletzt bearbeitet:
Super! Vielen Dank! :)
 
Das Stylesheet würde ich an deiner Stelle auslagern, wenn du mehrere
Seiten machst oder mehr Angaben definierst.
Dann hast du auch nicht so einen Code-Wulst oben drin.
Einfach eine neue Datei wo einfach die Styles reinkommen (also alles, was
zwischen den Klammern <style>…</style> steht), diese Datei nennst du
dann zB styles.css und wird mit <link rel="stylesheet" type="text/css" href="styles.css" />
zwischen die <head>-Tags (also da, wo die Styles jetzt stehen) eingebaut.
 
sehr, sehr gut!

wie kann ich denn noch den abstand zwischen navi und kasten verkleinern?
ich finde da irgendwie keine "top" werte, oder so!

und wie mache ich das, wenn ich unten links unter dem kasten noch kontakt und impressum stehen haben will?
 
für den kontakt-kasten bevor der wrapper-div zumacht (vor dem letzen </div>)
das einfügen
Code: 
<div id="info">
<ul>
<li><a href=#>kontakt</a></li>
<li><a href=#>impressum</a></li>
</ul>
</div>
und das CSS ergänzen mit:
Code: 
#info li {
float: left;
margin-right: 20px;
margin-top: 5px;
}

für den Abstand des Menüs zum Content im CSS die Höhe vom Menü
verringern (#menu: height: …).


das position: relative; im #menu kannst raushaun…
das war noch ein relikt von dem wo ichs raus hab…
 
ok! das wird ja immer besser! :)

wie bekomme ich das hin, dass der aktive navi-punkt eingefärbt ist?
 
Wie setzt du die Seite um?
Hast du reines HTML, also für jeden einzelnen Menüpunkt eine extra Seite?
Ansonsten gehts nur mit JavaScript oder PHP.
 
ja genau! ich mache für jeden punkt eine seite! ist aber schon ok!

da finde ich mich dann gut zurecht! :)
 
Dann würd ich dir vorschlagen eine CSS-Klasse active zu machen,
die du dann dem jeweiligen Menüpunkt zuweist auf der grad aktiven
Seite zB. <li><a href="..." class="active">Links</a></li>
und dann im CSS: .active { color: red; } – dann wird auf der Links-Seite
der Menüpunkt rot, demenstprechend dann auch auf den anderen Seiten
der Menüpunkt der diese Klasse erhält.
Hat den Vorteil, dass du dann nur im CSS zB die Farbe ändern musst
und das nicht in jedem einzelnen Dokument machen musst.
 
das letzte haut nicht so richtig hin!

geht sowas auch?

<style type="text/css">

a:link{text-decoration: underline; color: #000000;}

a:active{text-decoration: underline; color: #990000;}

a:visited{text-decoration: underline; color: #000000;}

a:hover{text-decoration: underline; color: #000000;}



</style>


nur...was muss ich dann noch in die <a klammer schreiben?
 
Das ist die ganz normale Definition von den Links, da musst du
nichts mehr in den <a-Tag schreiben.
Aber das löst nicht dein Problem des aktiven Links, das active ist
missverständlich, bezeichnet nur den Link, während man drauf klickt.
 
Tobi24 schrieb:
nur...was muss ich dann noch in die <a klammer schreiben?
Zum Vergrößern anklicken....

Dein Ziel Link ;) ... wenn du es global in css definierst, brauchst du keine id/class-Angabe angeben.
 
Ja das mit dem Ziel hat er glaub ich eh, ich hab ihn glaub ich mit der
Klassen-Definition für den aktiven Link verwirrt :)
 
ok!

aber wie geht es denn jetzt genau?
 
edit: wurde inzwischen wieder entfernt :)
 
Zuletzt bearbeitet:
lea schrieb:
[]
Zum Vergrößern anklicken....
<unkmodus>
ob das der internet explorer unter windows so versteht? schon probiert? mein ie mac verreisst die seite ...
</unkmodus>
 
Zuletzt bearbeitet von einem Moderator:
xlqr schrieb:
<unkmodus>
ob das der internet explorer unter windows so versteht? schon probiert? mein ie mac verreisst die seite ...
</unkmodus>
Zum Vergrößern anklicken....

stimmt! habe zwar kein ie für mac, aber firefox macht auch mist. es tauchen dort innerhalb des inhaltskastens scrollbalken auf und der hintergrund kachelt!

was kann ich da machen?
 
habe noch ne andere frage:

ich habe in einem foto ebenen definiert, die man anschließend anklicken kann:

<style type="text/css" media="screen"><!--
#Ebene1 { height: 70px; width: 70px; left: 290px; top: 180px; position: absolute; visibility: visible; }

--></style>


und unten dann

<a href="bla.html" target="unten">
<div id="Ebene1"></div>

</a>


etc.


in windows wird aber angeblich der mauszeiger nicht zu einer hand!
mein safari machts!

was kann man da tun?
 
xlqr schrieb:
<unkmodus>
ob das der internet explorer unter windows so versteht? schon probiert? mein ie mac verreisst die seite ...
</unkmodus>
Zum Vergrößern anklicken....
nein da kein win zur verfügung, mac-ie gibts in meiner welt nicht mehr ;)
ich hab ähnliches auf einer seite, kann sein, dass ich für einige elemente
für den ie extra css hab, ich weiß nicht mehr genau, was ich alles verbessert
hab, kann auch grad nicht nachschaun.
sollte außerdem ja nur ein anfangsgedanke sein, wie er es umsetzen kann, ganz die
arbeit übernehmen wollte ich eigentlich eh nicht ;)
ff und safari mac funktionieren bei mir mit dem bsp. – egal.
ich habs jetzt wieder runter von meinem webspace, war ja genug zeit
zum anschaun :)
 
Zuletzt bearbeitet:
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben Unten