zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > (X)HTML
Seite neu laden Auch nach Navigation Abstand einhalten

Antwort
 
LinkBack Themen-Optionen Ansicht
  #11 (permalink)  
Alt 30.08.2016, 15:09
Benutzerbild von protonenbeschleuniger
Verbesserer
XHTMLforum-Kenner
 
Registriert seit: 06.09.2007
Beiträge: 4.674
protonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblick
Standard

Das liegt daran nicht an irgendeinem margin, sondern daran das die Navigation floated. Dadurch wird der Platz für den geringer.

Die einfachste Lösung ist, wenn du die Navigation absolut positionierst.
Mit Zitat antworten
Sponsored Links
  #12 (permalink)  
Alt 30.08.2016, 15:19
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 04.11.2015
Beiträge: 191
David1997 befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von protonenbeschleuniger Beitrag anzeigen
Das liegt daran nicht an irgendeinem margin, sondern daran das die Navigation floated. Dadurch wird der Platz für den geringer.

Die einfachste Lösung ist, wenn du die Navigation absolut positionierst.
Wenn ich das so machen, verschiebt sich allerdings alles auf meiner Website. Gibt es noch eine andere Lösung?

Geändert von David1997 (30.08.2016 um 15:23 Uhr)
Mit Zitat antworten
Sponsored Links
  #13 (permalink)  
Alt 30.08.2016, 15:28
Benutzerbild von etux
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 17.09.2007
Ort: Berlin
Beiträge: 629
etux wird schon bald berühmt werden
Standard

Wenn Du dem form-Element (#form) oder dem div (#contact_form) ein „overflow: auto;“ gibst, ist das, was Du erreichen willst?

.
__________________
Grüße: Emil
--------------------------------------
http://emil-webdesign.net/
Mit Zitat antworten
  #14 (permalink)  
Alt 30.08.2016, 15:29
Benutzerbild von protonenbeschleuniger
Verbesserer
XHTMLforum-Kenner
 
Registriert seit: 06.09.2007
Beiträge: 4.674
protonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von David1997 Beitrag anzeigen
Wenn ich das so machen, verschiebt sich allerdings alles auf meiner Website. Gibt es noch eine andere Lösung?
Kommt drauf an, was du erreichen willst, wie gesagt wenn wir nur einen Teil deines Problems Wissen, dann können wir dir nur schwer helfen. Ich verstehe z.b. nicht, warum sich alles auf deiner Webseite verschieben sollte.

Geändert von protonenbeschleuniger (30.08.2016 um 15:33 Uhr)
Mit Zitat antworten
  #15 (permalink)  
Alt 30.08.2016, 15:58
Benutzerbild von protonenbeschleuniger
Verbesserer
XHTMLforum-Kenner
 
Registriert seit: 06.09.2007
Beiträge: 4.674
protonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von David1997 Beitrag anzeigen
Ja, das funktioniert. Allerdings nur für den einen Beispiel-Code.
Auch mein Vorschlag funktioniert mit dem Beispielcode. Wie gesagt, warum er bei dir nicht funktioniert Wissen wir nicht.
Mit Zitat antworten
  #16 (permalink)  
Alt 30.08.2016, 16:04
Benutzerbild von protonenbeschleuniger
Verbesserer
XHTMLforum-Kenner
 
Registriert seit: 06.09.2007
Beiträge: 4.674
protonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von David1997 Beitrag anzeigen
Erkennst du, wo mein Fehler ist?
Da ist viel durcheinander.
* die BR Elemente zwischen den Listenelemente gehören da nicht hin, wenn du Abstände machen willst, nimm padding/margin
* Du arbeitest wild mit irgendwelchen Werten wie z.b. width:80% die aus reinem probieren entstehen.
* Wenn du Elemente gruppieren willst, dann tu das. Du machst das mit der Navigation auch, dann solltest du auch den Inhalt gruppieren.
z.b. mit dem main Element https://www.w3.org/TR/html5/grouping...e-main-element
Mit Zitat antworten
  #17 (permalink)  
Alt 30.08.2016, 16:11
Benutzerbild von etux
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 17.09.2007
Ort: Berlin
Beiträge: 629
etux wird schon bald berühmt werden
Standard

Ich sehe gerade, dass Du schon mal Probleme mit ähnlichen Konstrukten hattest.
Aus dem letzten Beispiel (was gerade eben noch da war) wird mir auch klar, dass das ein Schwachpunkt von Dir ist.
Wie sich floatende und nich-floatende Elemente zu einander verhalten, was weicht dem floatenden Element aus – das ganze nicht-floatende Element oder nur dessen (Text)-Inhalt? Was ist Block-Formatting-Context usw.
Wenn Dir das alles klar ist, wirst Du Deine Probleme schnell selber Lösen können.
Ich schau mir gern Dein Problem an, aber mir ist so auf die Schnelle nicht klar, was Du erreichen willst. Vielleicht später, wenn ich wieder etwas Zeit habe. Sorry.
…. und wenn das Beispiel wieder da ist.
__________________
Grüße: Emil
--------------------------------------
http://emil-webdesign.net/
Mit Zitat antworten
  #18 (permalink)  
Alt 30.08.2016, 16:25
Benutzerbild von protonenbeschleuniger
Verbesserer
XHTMLforum-Kenner
 
Registriert seit: 06.09.2007
Beiträge: 4.674
protonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblick
Standard

Ich habe es gespeichert (um die Probleme zu sehen)
HTML-Code:
<!DOCTYPE html>
<html>
<head>
<style>
html, body	{
	min-width:1060px;
	max-width:1500px;
	font-family:Helvetica;
	background-color:#FEEECD;
}
table	{
	width:80%;
	max-width:1200px;
	margin-left:auto;
	margin-right:auto;
	border-style:solid;
	border-width:1px;
	border-collapse:collapse;
	background-color:white;
}
td {
	border-width:1px;
	border-style:solid;
	border-color:rgba(0,0,0,0.28);
	padding:10px;
}
nav	{
	margin-top:18px;
	width:200px;
	float:left;
	border-style:solid;
	border-width:1px;
	border-color:black;
	margin-right:10px;
	background-color:white;
}
.table_title	{
	text-align:center;
	font-size:22px;
}
</style>
</head>
<body>

<nav>
<ul id="navigation_ul_left">
<li class="li_navigation_left">Navigations-Platzhalter 1</li>
<br>
<li class="li_navigation_left">Navigations-Platzhalter 2</li>
<br>
<li class="li_navigation_left">Navigations-Platzhalter 3</li>
<br>
<li class="li_navigation_left">Navigations-Platzhalter 4</li>
<br>
<li class="li_navigation_left">Navigations-Platzhalter 5</li>
</ul>
</nav>

<span id="title_of_table" class="table_title">Title 1</span>

<table>
<tbody>
<tr>
<td class="left">Title</td>
<td class="middle">Title</td>
<td class="right">Title</td>
</tr>
<tr>
<td class="left">Title</td>
<td class="middle">Title</td>
<td class="right">Title</td>
</tr>
<tr>
<td class="left">Title</td>
<td class="middle">Title</td>
<td class="right">Title</td>
</tr>
<tr>
<td class="left">Title</td>
<td class="middle">Title</td>
<td class="right">Title</td>
</tr>
<tr>
<td class="left">Title</td>
<td class="middle">Title</td>
<td class="right">Title</td>
</tr>
<tr>
<td class="left">Title</td>
<td class="middle">Title</td>
<td class="right">Title</td>
</tr>
<tr>
<td class="left">Title</td>
<td class="middle">Title</td>
<td class="right">Title</td>
</tr>
<tr>
<td class="left">Title</td>
<td class="middle">Title</td>
<td class="right">Title</td>
</tr>
</tbody>
</table> 

<span id="title_of_table" class="table_title">Title 1</span>

<table>
<tbody>
<tr>
<td class="left">Title</td>
<td class="middle">Title</td>
<td class="right">Title</td>
</tr>
<tr>
<td class="left">Title</td>
<td class="middle">Title</td>
<td class="right">Title</td>
</tr>
<tr>
<td class="left">Title</td>
<td class="middle">Title</td>
<td class="right">Title</td>
</tr>
<tr>
<td class="left">Title</td>
<td class="middle">Title</td>
<td class="right">Title</td>
</tr>
<tr>
<td class="left">Title</td>
<td class="middle">Title</td>
<td class="right">Title</td>
</tr>
<tr>
<td class="left">Title</td>
<td class="middle">Title</td>
<td class="right">Title</td>
</tr>
<tr>
<td class="left">Title</td>
<td class="middle">Title</td>
<td class="right">Title</td>
</tr>
<tr>
<td class="left">Title</td>
<td class="middle">Title</td>
<td class="right">Title</td>
</tr>
</tbody>
</table>

</body>
</html>
Mit Zitat antworten
  #19 (permalink)  
Alt 30.08.2016, 16:57
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 04.11.2015
Beiträge: 191
David1997 befindet sich auf einem aufstrebenden Ast
Standard

Die overflow:auto;-Methode scheint vom Prinzip her zu funktionieren. Allerdings frage ich mich, ob das sinnvoll und die gängige Art ist, die auch mit anderen Browsern kompatibel ist. Was meint ihr?

P.S. Ich werde meinen Code noch mal etwas ordnen und melde mich dan zurück.
Mit Zitat antworten
Sponsored Links
  #20 (permalink)  
Alt 30.08.2016, 17:50
Benutzerbild von etux
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 17.09.2007
Ort: Berlin
Beiträge: 629
etux wird schon bald berühmt werden
Standard

Zitat:
Zitat von David1997 Beitrag anzeigen
Die overflow:auto;-Methode scheint vom Prinzip her zu funktionieren. Allerdings frage ich mich, ob das sinnvoll und die gängige Art ist, die auch mit anderen Browsern kompatibel ist. Was meint ihr?
Wie die „Methode“ funktioniert, sollte Dir erst mal klar sein. In Deinem Fall wäre zu klären: wie sich ein nichtfloatende Element, was ein Block Formatting Context etabliert (in diesem Fall durch „overflow: auto;“) neben einem floatenden Element verhält.
In Deinem letzten Beispiel (Danke, protonenbeschleuniger) sind es aber 4 Elementen.
Was Dir noch nicht klar ist, ist das Zentrieren von Elementen. Auch im Zusammenspiel mit „max-width“.
HTML-Code wurde, glaube ich, schon „besprochen“: doctype und die unzählige Fehler …

Wenn ich Dich richtig verstehe, willst Du die Nav links haben und die restliche Elemente rechts daneben. Wobei die immer in der Mitte der restlichen Breite stehen sollen.
Die obigen „Methode“ kommt also nicht in Frage.
Lösungswege gebe es aber dennoch reichlich.

Nur ein Beispiel:
Von der gesamten Breite wir Platz abgezogen und nur für die Nav „reserviert“.
body { padding-left: 200px }
nav { margin-left: -200px }
Die restliche Elemente „sehen“ diesen Rand nicht und können auf die Restbreite zentriert werden.

Also besser CSS und HTML lernen, statt so welche sinnfreie „Umfragen“ zu starten.


Edit:
Zitat:
Zitat von etux Beitrag anzeigen
... Die obigen „Methode“ kommt also nicht in Frage ...
Natürlich kommt sie auch in Frage. Es müssen nur die erforderliche Bedingungen dafür geschaffen werden. Beispielsweise alles außer „nav“ in einem extra Element rein packen.

Und auf Deine Umfrage eine halbe Antwort zu geben: ich nutze sie (so gut wie) nie

.
__________________
Grüße: Emil
--------------------------------------
http://emil-webdesign.net/

Geändert von etux (30.08.2016 um 18:03 Uhr)
Mit Zitat antworten
Sponsored Links
Antwort

Stichwörter
css, html, navigation

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Ausrichtung Kalender greece4u CSS 20 14.05.2012 13:32
Navigation ist nicht mittig Schokokrapfen CSS 29 19.09.2011 23:19
Problem mit Navigation safari CSS 12 20.04.2011 11:11
Float-Problem? mischaef CSS 33 20.10.2010 16:20
Javascript UL Navigation im IE6 ven CSS 7 29.04.2008 15:29


Alle Zeitangaben in WEZ +2. Es ist jetzt 18:55 Uhr.