zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Div: vertikale Reihenfolge ändern

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 16.11.2010, 17:18
0xBAADFEED
Gast
Thread-Ersteller
 
Beiträge: n/a
Ausrufezeichen Div: vertikale Reihenfolge ändern

Hallo,

ich versuche gerade, mein Template etwas in Richtung SEO bzw. Sreenreader zu optimieren. Dazu möchte ich die beiden Divs (1. Navigation, 2. Content), die im DOM bzgl. SEO/Screenreader genau umgedreht (1. Content, 2. Navigation) stehen, in der Darstellung im Browser tauschen. Da ich keine absolute Positionierung verwenden möchte, versuche ich es gerade mit float und relativer Positionierung.

Leider verschwindet dabei im IE <= Version 7 die Navigationsleiste. Vielleicht kann mir hier jemand einen Tipp geben, wie ich hier weiterkomme...!?

Folgendes Beispiel verwende ich zum Testen:
hier
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=utf-8" />
<title>Vertical Order</title>
<style>
div#container {
	width: 960px;
	margin: 0 auto;
	background-color: #6CF;
	float: left;
}

div#first {
	width: 960px;
	background-color:#99F;
	position: relative;
	height: 50px;
	top:0;
}

div#second {
	width: 960px;
	background-color:#3F9;
	float: right;
	position: relative;
	top: 50px;
}
</style>
</head>

<body>
<div id="container">
<div id="second">Lorem ipsum dolor sit amet...</div>
<div id="first">Navigation</div>
<div style="clear: both;"></div>
</div>
</body>
</html>
Schon mal Danke für eure Hilfe!
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 16.11.2010, 17:54
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.848
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Was Du da zu bauen versuchst, ist auch nicht besser als pos. abs. (denn durch den festen Wert von 50px für height und top ist eh alles festgenagelt), eher schlechter, da würde ich lieber pos. abs. verwenden. Allerdings wäre em besser als px, da Deine Navi ja sicher Text enthält.
__________________
Wer keinen Link auf seine problembehaftete Seite posten kann, weil diese noch nicht online ist: Testcase bauen, online stellen, Link posten.
Internet-Grundregel: Unbekannte Begriffe googeln! (Erspart 99% aller Nachfragen.)
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 16.11.2010, 18:27
0xBAADFEED
Gast
Thread-Ersteller
 
Beiträge: n/a
Standard

Hallo heiko_rs,

ja, im Nachhinein betrachtet hast du da wohl recht.

Das ursächliche Problem, weshalb ich eine absolute Positionierung umgehen wollte ist, dass ich am Ende des Containers kein Div für die Fußzeile mehr einfügen kann, da der Contentbereich eine variable Höhe hat und bottom: 0; nicht funktioniert, als das dadurch Container-Div nicht erweitert wird sondern hinter dem Content-Div verschwindet...

Gibt's hier vllt. eine elegante Lösung?

Danke!
Mit Zitat antworten
  #4 (permalink)  
Alt 16.11.2010, 18:32
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.848
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Ich dachte es ist selbstverständlich, dass ausschließlich die Navi pos. abs. bekommt
__________________
Wer keinen Link auf seine problembehaftete Seite posten kann, weil diese noch nicht online ist: Testcase bauen, online stellen, Link posten.
Internet-Grundregel: Unbekannte Begriffe googeln! (Erspart 99% aller Nachfragen.)
Mit Zitat antworten
  #5 (permalink)  
Alt 16.11.2010, 18:42
0xBAADFEED
Gast
Thread-Ersteller
 
Beiträge: n/a
Standard

OK, gut. Nur wie bring ich den Content dann unter die absolut-positionierte Navi ohne hier auch ein position: absolute; zu verwenden?
Mit Zitat antworten
  #6 (permalink)  
Alt 16.11.2010, 18:48
Benutzerbild von ArcVieh
//
XHTMLforum-Kenner
 
Registriert seit: 19.12.2006
Ort: Gütersloh
Beiträge: 1.844
ArcVieh sorgt für eine eindrucksvolle AtmosphäreArcVieh sorgt für eine eindrucksvolle Atmosphäre
Standard

Zitat:
Zitat von Spice1983 Beitrag anzeigen
OK, gut. Nur wie bring ich den Content dann unter die absolut-positionierte Navi ohne hier auch ein position: absolute; zu verwenden?
Padding o. Margin.
__________________
CSS-FAQ beantwortet die meisten Fragen | Retro coding gegen Divitis | Code validieren & posten für Hilfe
Mit Zitat antworten
  #7 (permalink)  
Alt 16.11.2010, 19:25
0xBAADFEED
Gast
Thread-Ersteller
 
Beiträge: n/a
Standard

Ja, klar! Vielen Dank...
Mit Zitat antworten
Antwort

Stichwörter
absolute, css, div, float, order, position, relative, vertical

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
Fragen zu CSS und Joomla DOKTOR CSS 2 23.05.2011 20:29
Brauche Hilfe: Schwarzes Nichts Zwox CSS 10 19.11.2010 17:53
Header entfernen tripple CSS 17 15.06.2010 16:41
Schriftfarbe in den Eintragungsfeldern von jforms Steveislucky CSS 2 16.03.2010 11:59
CSS Text nebeinander? carstiee09 CSS 13 13.11.2009 20:18


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