• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

relative und absolute positionen

K

Kurostuki

Neues Mitglied
Hey Hey

Ich bin gerade dabei eine Homepage zu erstellen und habe ein kleines problem.

Am anfang habe ich die positionen meiner Tabellen mit absolute bestimmt. aber jetzt wo ich gesehen habe wie das aussieht wenn ich das browser fenster kleiner zeihe wollte ich alles in relative machen und das hat dann dazu gefüht das meine tabellen nicht mehr da waren wo sie eigentlich sind ... ich sitze da schon seit rund 4 tagen dran und habe mir jetzt mal gedacht das ich hier mal ein thema erstelle in der hoffnung das mir jemand helfen kann.

Ich bedanke mich jetzt schon auf jede hilfe die ich bekomme

Liebe grüße

Kuro
 
Werbung:
hey kurostuki,

also ich würde dir ertsmal empfehlen mit den neuen html 5 Tags zu arbeiten und dazu noch dir die div-Tag anschauen,

denn mit tabellen hat man meistens probleme, wenn man sich nicht richtig auskennt, mit den div-Tag sieht es auch viel übersichtlicher aus.

Ich würde sagen du schauest dir mal css genau an. Falls du danach immer noch probleme hast, kannst du es ja hier posten

Mfg
Flava
 
Werbung:
also ich habe das mit den div-tags schon gemacht und was sollte ich den an mein css ändern? :3
ich gucke mir aber glaube ich erst mal die links an.

Danke euch beiden :)

Gruß Kuro

so ich habe jetzt nochmal geguckt :/

meine div-tags sind so weit eigentlich da wo sie sein solln aber ich habe vergessen zu schreiben das ich noch eine diashow (javascript) in der mitte der main tabelle habe und ja :/ ich checke das einfach nicht

wäre echt dankbar wenn mir jemand dabei helfen könnte :/

gruß
Kuro

PS:Wenn ich die diabox verschiebe ist eine weiße fläche auf dem hintergrund wo eigentlich keine sein sollte
 
Zuletzt bearbeitet von einem Moderator:
Werbung:
Ja reinkopieren. In die Zwischenablage und dann hier in das Eingabefenster einfügen.

Nils aka XraYSoLo
 
einmal html:

HTML: 
<body link="#ffffff" alink="#ffffff" vlink="#ffffff" >
				<!--Head-Tabelle-->
<div style="position:absolute; left:1%; top:2%"> 
	<table >
		<tr>
			<td>
				<a href="index.html"><img src="http://www.oldenburger-music-station.de/banner_black.jpg" style="width:50%; height:60%">
			</td>
			<td >
			</td>
		</tr>
	</table>
</div>   	
				<!--Head-Navi-->
<div class="Navi1"style="position:relative; left:26%; top:3%" >
    <table >
		<tr>                
			<td>
                <a href="index.html">Home</a>
            </td>
            <td >
                <a href="index.html">Gitarren</a>
            </td>
            <td>
                <a href="index.html">Schlagzeuge</a>
            </td>
            <td>
                <a href="index.html">Percussion</a>
            </td>
            <td>
                <a href="index.html">Veranstaltungstechnik</a>
            </td>
            <td>
				<a href="index.html">Kontakt</a>
            </td>
		</tr>
    </table>
</div>
				<!--Der Hintergrumnd-->
			<div class="Hintergrund" style="position:relative; top:19; width:91%; height:95%;">
                <table >
                    <tr>
                        <td>
				<!-- Wilkommen text-->		
<div>
	<table>
		<tr>
			<td>
			
			</td>
		</tr>
	</table>
</div>	
				<!--Main Tabelle-->
<div class="dia" style="position:absolute; top:200; left:18%;">
<table>
	<tr>
		<td>
				<!--Dia-Show-->
<div id="slideshow">
			<img src="http://www.oldenburger-music-station.de/Music-Station%20Strassenfront.jpg" alt="Seite 01" />
            <img src="http://www.oldenburger-music-station.de/Music-Station%20Anschrift.jpg" alt="Seite 02" />
            <img src="http://www.oldenburger-music-station.de/Music-Station-Crew.jpg" alt="Seite 03" />
            <img src="http://www.oldenburger-music-station.de/Marshall-Bild.jpg" alt="Seite 04" />
            <img src="http://www.oldenburger-music-station.de/Gitarrenraum.jpg" alt="Seite 05" />
			
		<script type="text/javascript">
			$('#slideshow').jqFancyTransitions({ width: 500, height: 286, delay: 3500, effect: 'fountainAlternate', direction: 'top', stripDelay: 80, strips: 10, titleOpacity: 0.0, position: 'alternate'});
		</script> 	
</div>
		</td>
	</tr>	
</table>
</div>		
			<!--Such Tabelle-->
<div class="suche" style="position:absolute; left:1%; top:5%" >
	<table >
		<tr> 
			<td>
				Suche
			</td>
		</tr>
		<tr>
			<td >
				<div id="search" style="position:relative; left:0%; top:40%">
				<form name="form1" method="post" action="suche.php">
				<input style="position:relative; height:0%; widght:0%" type="text" name="search"/><br />
				<input type="submit" name="Submit" value="Suchen" />
				</form>
				</div>
			</td>
		</tr>
	</table>
</div>
				<!--Die Navigation-->						
<div class="Navi" style="position:absolute; left:1%; top:20%">
	<table>
		<tr> 
			<td>
				Navigation
			</td>
		</tr>
		<tr>
			<td class="link" onclick="javascript:window.location.href='index.html'"style="font-size:12px">
				<b>&bull;&raquo;start</b>
			</td>
		</tr>
		<tr>
			<td class="link" onclick="javascript:window.location.href='Angebot der Woche.html'"style="font-size:12px">
				<b>&bull;Angebot der Woche</b>
		</tr>
		<tr>
			<td class="link" onclick="javascript:window.location.href='Sonderpreise Specials.html'"style="font-size:12px">
				<b>&bull;Sonderpreise / Specials</b></td>
		</tr>
		<tr>
			<td class="link" onclick="javascript:window.location.href='Gitarren, Bässe, Amps.html'"style="font-size:12px">
				<b>&bull;Gitarren, Bässe, Amps
			</td>
		</tr>
		<tr>
			<td class="link" onclick="javascript:window.location.href='Drums u. Percussion.html'"style="font-size:12px">
				<b>&bull;Drums u. Percussion</b></td>
		</tr>
		<tr>
			<td class="link" onclick="javascript:window.location.href='Veranstaltungstechnik.html'"style="font-size:12px">
				<b>&bull;Veranstaltungstechnik</b></td>
		</tr>
		<tr>
			<td class="link" onclick="javascript:window.location.href='PA,Licht,Beamer Verleih.html'"style="font-size:12px">
				<b>&bull;PA,Licht,Beamer Verleih</b></td>
		</tr>
		<tr>
			<td class="link" onclick="javascript:window.location.href='PA- und Licht Verkauf.html'"style="font-size:12px">
				<b>&bull;PA- und Licht Verkauf</b></td>
		</tr>
		<tr>
			<td class="link" onclick="javascript:window.location.href='Reparaturservice.html'"style="font-size:12px">
				<b>&bull;Reparaturservice</b></td>
		</tr>
		<tr>
			<td class="link" onclick="javascript:window.location.href='Anfahrt.html'"style="font-size:12px">
				<b>&bull;Anfahrt</b></td>
		</tr>
		<tr>
			<td class="link" onclick="javascript:window.location.href='Öffnungszeiten.html'"style="font-size:12px">
				<b>&bull;Öffnungszeiten</b></td>
		</tr>
		<tr>
			<td class="link" onclick="javascript:window.location.href='Impressum.html'"style="font-size:12px">
				<b>&bull;Impressum</b></td>
	</table>
</div>
			<!--Fan Bereich-->
<div class="box" style="position:absolute; left:66%; top:5%" >
	<table >
		<tr> 
			<td>
				Werde Fan
			</td>
		</tr>
		<tr>
			<td>
				<a href="http://www.facebook.com/omusicstation"target="_blank"><img src="http://www.fws.gov/letsgooutside/media/facebook_logo.png" alt="Unsere Facebook seite" height="40%" width="100%"></a>
			</td>
		</tr>
	</table>
</div>
			<!--Öffnungszeiten-->
<div class="box" style="position:absolute; left:66%; top:22%" >
	<table >
		<tr> 
			<td>
				Öffnungszeiten
			</td>
		</tr>
		<tr>
			<td style="font-size:12px">
				Montag bis Freitag 
				<br>
				10-18 Uhr
				<br>
				<br>
				Samstags 
				<br>
				10-14 Uhr
			</td>
		</tr>
	</table>
</div>
			<!--Kontakt-->
<div class="box" style="position:absolute; left:66%; top:39%" >
	<table >
		<tr> 
			<td>
				Kontakt
			</td>
		</tr>
		<tr>
			<td style="font-size:12px">
				<b>Telefon:</b>
				<br>
				0441/3800333
				<br>
				<br>
				<b>Fax:</b>
				<br>
				0441/8006554
				<br>
				<br>
				<b>Adresse:</b>
				<br>
				Nadorster Str. 254
				<br>
				26125 Oldenburg
			</td>
		</tr>
	</table>
</div>
			<!--Besucher-->
<div class="box" style="position:absolute; left:66%; top:64%" >
	<table >
		<tr> 
			<td>
				Unsere Besucher
			</td>
		</tr>
		<tr>
			<td>
				Heute: ----
				<br>
				Gestern: ----
				<br>
				Gesamt: ----
				<br>
				Online: ----
				
			</td>
		</tr>
	</table>
</div>
						</td>
					</tr>
				</table>
            </div>
			<!--Händerl unten-->
<div>
	<table>
		<tr>
			<td>
			
			</td>
		</tr>
	</table>
</div>
 
Sämtliche Tabelle raus, braucht man keine Einzige. Der <body>-Tag ist nicht mit Attributen zu versehen. Ansonsten nach Möglichkeit nichts absolut positionieren, sonst versetzt dir das in Verbindung mit verschiedenen Seitengrößen und Prozentangaben die kompletten Positionierungen. ein DOCTYPE und eine korrekte Strukturauszeichung fehlt auch.

Nils aka XraYSoLo
 
Werbung:
Werbung:
Der Inhalt einer einzelnen CSS-Datei zu groß? An deinem Script gemessen, kann die größer als 30 Zeilen sein.

Nils aka XraYSoLo
 
da ich noch nicht mit scc vertraut bin habe ich mir einen generator zugelegt und den code da eingefügt :/ ich misste das gerade aus aber naja ... da sind halt recht viele unnötige sachen drin warte ich mache das fertig dann bekommst du es
 
Werbung:
Werbung:
Siehs mal von der anderen Seite. Du produzierst (oder lässt produzieren) Code, den du selber nicht verstehst und mit dem du die größten Schwierigkeiten hast. In ein paar Tagen lernt man das alles nicht, sondern muss ich intensiv damit auseinandersetzen. Die einzige Möglichkeit. etwas fertig zu erhalten, wäre, es in die Jobbörse/ zu geben, nur da wirst du so gut wie nichts umsonst bekommen.

Nils aka XraYSoLo
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben