2x css probleme bei webseite

slateSC

The Suntoucher

Registered: Jul 2004
Location: oö
Posts: 1256

01.12.2010 - 03:33

da im xhtml forum nur arrogante schnösel unterwegs sind und ich
mein problem noch immer nicht lösen konnte dachte ich mir ich
wende mich lieber mal an das forum meines vertrauens!

Mein erstes problem ist hier beschrieben.
Es geht grundsätzlich um 2 container in der footerstage die benötigt werden
damit ich neben dem impressum eine facebook und youtube grafik einbinden kann.

link zur seite

Beim 2ten problem geht es darum, dass die seite bei netbooks nach
oben hinausgeschoben wird und auf das menü nicht mehr zugegriffen werden kann.
Laut den leuten bei xhtml hat das etwas mit der falschen
zentrierung zu tun!? mit dieser info konnte ich aber leider nichts anfangen...

Danke schonmal für eure hilfe!

Spikx

My Little Pwny

Registered: Jan 2002
Location: Scotland
Posts: 13496

01.12.2010 - 07:35

ad 1) es gibt kein float:center, nur left, right, none

. In deinem Fall brauchst du wahrscheinlich right?

ad 2) das liegt an deiner Zentrierung ja, also das

width: 925px;
height: 497px;
position: absolute;
top: 50%;
left: 50%;
margin-left: -462px;
margin-top: -248px;

Einen besseren Weg weiß ich allerdings auch nicht und würde mich auch interessieren

djonny

Addicted

Registered: Oct 2008
Location: Bgld/W
Posts: 598

01.12.2010 - 08:50

hier wird die vertikale und horizontale Zentrierung beschrieben http://www.manuel-bieh.de/blog/vert...-seiten-mit-css

für dein Problem mit der Footer Teilung.
hast du schon mal float:right probiert?

edit: hab hier auch noch einen Link zur vertikalen und horizontalen Zentrierung gefunden: http://www.jakpsatweb.cz/css/css-ve...r-solution.html

Bearbeitet von djonny am 01.12.2010, 08:59

Spikx

My Little Pwny

Registered: Jan 2002
Location: Scotland
Posts: 13496

01.12.2010 - 09:01

Zitat von djonny
hier wird die vertikale und horizontale Zentrierung beschrieben http://www.manuel-bieh.de/blog/vert...-seiten-mit-css

Sehr schön, thx.

AbSailer

boo hoo wendy

Registered: Aug 2002
Location: Linz/Stmk
Posts: 1160

01.12.2010 - 09:18

@ Footerteilung:
das mit der Tabelle bleibt aber nicht, oder ist das nur temporär?

Wenn ich einen Footer zu unterteilen habe löse ich das mit boxen die sich nach rechts ausrichten, der Code dafür wäre folgender (Beispielcode! müsstest bissl anpassen, vom aufbau her sollte es hinkommen):

HTML:

<div id="footer">
<div id="pos_footext">
<div class="box">
hier grafik soundso
</div>
<div class="box">
hier grafik soundso
</div>
<div class="box">
noch eine Box für impressum
</div>
</div>
</div>

CSS:

#footer {
position: relative;
margin-top: 80px;
height: 101px;
border-top: #999999 1px solid;
margin-left: 50px;
margin-right: 50px;
}

#pos_footext {
margin-left: 160px;
}

.box {
width: 200px;
float: left;
margin: 20px 0 0 25px;
}

hth

slateSC

The Suntoucher

Registered: Jul 2004
Location: oö
Posts: 1256

01.12.2010 - 15:41

Danke für eure hilfe!

@AbSailer: was meinst du mit der Tabelle?
Tabellen hab ich nur im content bereich!?
- wennst die krassen farben meinst kommen die natürlich wieder weg!

probier das jetzt mal!

@die floater: habs mit "float right" probiert, dann springt das impressum zwar an die
richtige stelle nach rechts, aber immer noch in der zweiten zeile...

Bearbeitet von slateSC am 01.12.2010, 17:05

slateSC

The Suntoucher

Registered: Jul 2004
Location: oö
Posts: 1256

01.12.2010 - 19:26

So ich bin jetzt schon mal was die container im footer bereich betrifft
ein ordentliches stückerl weiter!

Aber immer noch nicht ganz am ziel...

Ich hab jetzt mal versucht deinen quellcode so gut es geht umzusetzen!

Aktuell sieht der ganze spaß so aus:

Es werden allerdings die grafiken nicht eingefügt und es sollten die
beiden boxen der grafiken schmäler sein als die des Impressums.
Und wenns geht das ganze rechtsbündig ausgerichtet werden, damit
weitere grafiken leichter eingefügt und entfernt werden können ohne die
boxen neu auszurichten!

ich hab mich jetzt schon mit einer "box2" für das impressum und einem "float right"
für die ausrichtung gespielt, allerdings ohne erfolg...

Allzuviel kann ja wohl nicht mehr falsch sein!?

Hier der code von der index.php:

Code: PHP

<body>

<div id="top-bg"> </div>
<div id="bottom-bg"> </div>

<div id="stage">
    <div id= "header"><jdoc:include type="modules" name="mainmenu" /></div>
    <div id= "subnavi"><jdoc:include type="modules" name="submenu" /></div>
        
	  <?php if( $this->countModules('left') ) { ?>
    
        <div id= "content-wrapper">
            <div id= "sidenav"><jdoc:include type="modules" name="left" /></div>
            <div id= "content"><jdoc:include type="component" /></div>
        </div>
    
   <?php } else { ?>
    
        <div id= "content-wrapper2">
            <div id= "content2"><jdoc:include type="component" /></div>
        </div>
        
    <?php } ?>
    
    <div id= "clearfloat"></div>
    
    <div id="footer">
<div id="pos_footext">
<div class="box">
<img name="" src="../layout/fb.gif" width="20" height="20" alt="FB" />
<!-- hier grafik soundso -->
</div>
<div class="box">
<img name="" src="../layout/youtube.gif" width="53" height="20" alt="YT" />
<!-- hier grafik soundso -->
</div>
<div class="box"><jdoc:include type="modules" name="footer" />
<!-- noch eine Box für impressum -->
</div>
</div><!-- #pos_footext ends -->
</div><!-- #footer ends -->
    
</div>

</body>

Und der ausm css:

Code: PHP

		#footer {
position: relative;
margin-top: 0px;
height: 55px;
margin-left: 7px;
margin-right: 7px;
font-size: 11px;
letter-spacing: 2px;
background-color:#4d0000;
	}
	#footer a:link {color:#ffffff; text-decoration: none;
	}
	#footer a:visited {color:#ffffff; text-decoration: none;
	}
	#footer a:hover {color:#f96f00; text-decoration: none;
	}
	#footer a:active {color:#f96f00; text-decoration: none;
	}
	#footer a:focus {color:#ffffff; text-decoration: none;
	}
#pos_footext {
margin-left: 600px;
}

.box {
width: 92px;
float: left;
margin: 20px 0 0 10px;
background-color:#009;
}

watchout

Legend
undead

Registered: Nov 2000
Location: Off the grid.
Posts: 6845

02.12.2010 - 03:43

.box divs raus
.pos_footext {text-align: right;}

welcher code wird von <jdoc:include type="modules" name="footer" /> eingefügt? das sollte dann natürlich auch ein inline-level element sein. Wenn nicht hast wieder Probleme mit automatischer width

tip: display:inline;

slateSC

The Suntoucher

Registered: Jul 2004
Location: oö
Posts: 1256

02.12.2010 - 14:12

hm.. da blick ich jetzt noch immer nicht ganz durch...

wenn ich die .box divs raus nehme und den footext auf right stelle wird zwar alles rechts
angeordnet, allerdings untereinander!

display:inline; sollte diese dann nebeneinander stellen (oder täusch ich mich da jetzt?)
Wenn ja; wo muss ich es dann platzieren? wenn ichs in den footer stelle wird der ganze
container aufgehoben und wenn ichs in den footext stelle zeigts keine wirkung!

Beim <jdoc:include type="modules" name="footer" /> handelt es sich um ein menü aus joomla -
da ist allerdings derzeit nur das Impressum drinnen! - wie steck ich das dann
genau in welches inline element?

AbSailer

boo hoo wendy

Registered: Aug 2002
Location: Linz/Stmk
Posts: 1160

02.12.2010 - 15:28

Zitat von slateSC
So ich bin jetzt schon mal was die container im footer bereich betrifft
ein ordentliches stückerl weiter!
Aber immer noch nicht ganz am ziel...

Ich hab jetzt mal versucht deinen quellcode so gut es geht umzusetzen!

Aktuell sieht der ganze spaß so aus:

Gibt's da ne Möglichkeit sich diese index.php online in "live" anzusehen, oder seh' ich den link grad nicht?

mfG

watchout

Legend
undead

Registered: Nov 2000
Location: Off the grid.
Posts: 6845

02.12.2010 - 15:40

Zitat
welcher code wird von <jdoc:include type="modules" name="footer" /> eingefügt?

display:inline bezieht sich natürlich auf das jeweilige Element, von dem was du oben gepostet hast lässt sich nicht darauf schließen warum das jetzt untereinander angeordnet ist.

Aber bitte kein Template-Code und .CSS Auszug mehr, sondern apply und Direktlink zur Seite mit dem Template mit besagtem Problem, dann kann man sich das Problem auch mit den passenden Tools anschaun.

djonny

Addicted

Registered: Oct 2008
Location: Bgld/W
Posts: 598

02.12.2010 - 18:58

Zitat von AbSailer
Gibt's da ne Möglichkeit sich diese index.php online in "live" anzusehen, oder seh' ich den link grad nicht?

mfG

Nein gibt es nicht deswegen fragt er ja bei uns nach weil im XHtml Forum wollten Sie ja auch das er die Seite auf eine Subdomain oder so lädt....

Live wäre das viel besser anzusehen denn im Firefox gibts zB Plugins wo man den Code verändern kann und selber testen kann

watchout

Legend
undead

Registered: Nov 2000
Location: Off the grid.
Posts: 6845

02.12.2010 - 19:24

slateSC:
Schau mal, wir sind viel lieber als die fiesen von XHTML Forum. Wir zwingen dich nicht eine neue Subdomain dafür einzurichten

Mach folgendes: Ruf die Seite auf im Firefox, dann gehts du auf "Datei"->"Seite Speichern unter..." da wählst du dann bei Dateityp "Webseite, komplett" aus und speicherst es in einen Ordner deiner Wahl.

Den Ordner zipst du dann und lädst ihn hier hoch oder stellst ihn in einen Unterordner auf deiner Seite bereit, mit Link, damit wir darauf zugreifen können

AbSailer

boo hoo wendy

Registered: Aug 2002
Location: Linz/Stmk
Posts: 1160

02.12.2010 - 21:22

Zitat von djonny
Nein gibt es nicht deswegen fragt er ja bei uns nach weil im XHtml Forum wollten Sie ja auch das er die Seite auf eine Subdomain oder so lädt....

Live wäre das viel besser anzusehen denn im Firefox gibts zB Plugins wo man den Code verändern kann und selber testen kann

darauf will ich hinaus

ohne echte Basis kann man die Lösung ja leider nur vermuten. Und da er was meinte von wegen index.php dachte ich auch dass das ganze Zeug wo online rumsteht...

EDIT in anderer Sache: baust du die Website quasi neu auf mit dem Boxmodell? Die alte ist ja "nur" mit Tabellen... wäre die Überlegung nicht das Inhaltsfenster eine spur größer (= höher) zu gestalten?

Bearbeitet von AbSailer am 02.12.2010, 21:25

slateSC

The Suntoucher

Registered: Jul 2004
Location: oö
Posts: 1256

09.12.2010 - 00:37

@all: Danke für die Geduld und Hilfsbereitschaft!

Ich hab den letzten Stand (siehe oberer post mit screenshot) jetzt mal hier direkt online gestellt.
(ich weiß einfach nicht wie ich die ganze Webseite + db. usw. dupliziere und
alles andere ist wahrscheinlich auch zu umständlich

)

Bzgl. der Frage mit den Tabellen; Im Editor von Joomla, habe ich manche der Seiten bei denen
es formatierungstechnisch nötig war (zB.: unter den Projects) auf die guten alten Tabellen zurückgegriffen
und werde dies wahrscheinlich auch nicht so schnell ändern,
da ich keinen Plan habe wie ich die Formatierungen anders hinbekomme...

(wo es leicht ging habe ich sie eh weggelassen)

und zwecks der höhe - Schon erledigt

Bearbeitet von slateSC am 09.12.2010, 00:48

slateSC The Suntoucher Registered: Jul 2004 Location: oö Posts: 1256	01.12.2010 - 03:33 da im xhtml forum nur arrogante schnösel unterwegs sind und ich mein problem noch immer nicht lösen konnte dachte ich mir ich wende mich lieber mal an das forum meines vertrauens! Mein erstes problem ist hier beschrieben. Es geht grundsätzlich um 2 container in der footerstage die benötigt werden damit ich neben dem impressum eine facebook und youtube grafik einbinden kann. link zur seite Beim 2ten problem geht es darum, dass die seite bei netbooks nach oben hinausgeschoben wird und auf das menü nicht mehr zugegriffen werden kann. Laut den leuten bei xhtml hat das etwas mit der falschen zentrierung zu tun!? mit dieser info konnte ich aber leider nichts anfangen... Danke schonmal für eure hilfe!
Spikx My Little Pwny Registered: Jan 2002 Location: Scotland Posts: 13496	01.12.2010 - 07:35 ad 1) es gibt kein float:center, nur left, right, none . In deinem Fall brauchst du wahrscheinlich right? ad 2) das liegt an deiner Zentrierung ja, also das width: 925px; height: 497px; position: absolute; top: 50%; left: 50%; margin-left: -462px; margin-top: -248px; Einen besseren Weg weiß ich allerdings auch nicht und würde mich auch interessieren
djonny Addicted Registered: Oct 2008 Location: Bgld/W Posts: 598	01.12.2010 - 08:50 hier wird die vertikale und horizontale Zentrierung beschrieben http://www.manuel-bieh.de/blog/vert...-seiten-mit-css für dein Problem mit der Footer Teilung. hast du schon mal float:right probiert? edit: hab hier auch noch einen Link zur vertikalen und horizontalen Zentrierung gefunden: http://www.jakpsatweb.cz/css/css-ve...r-solution.html Bearbeitet von djonny am 01.12.2010, 08:59
Spikx My Little Pwny Registered: Jan 2002 Location: Scotland Posts: 13496	01.12.2010 - 09:01 Zitat von djonny hier wird die vertikale und horizontale Zentrierung beschrieben http://www.manuel-bieh.de/blog/vert...-seiten-mit-css Sehr schön, thx.
AbSailer boo hoo wendy Registered: Aug 2002 Location: Linz/Stmk Posts: 1160	01.12.2010 - 09:18 @ Footerteilung: das mit der Tabelle bleibt aber nicht, oder ist das nur temporär? Wenn ich einen Footer zu unterteilen habe löse ich das mit boxen die sich nach rechts ausrichten, der Code dafür wäre folgender (Beispielcode! müsstest bissl anpassen, vom aufbau her sollte es hinkommen): HTML: <div id="footer"> <div id="pos_footext"> <div class="box"> hier grafik soundso </div> <div class="box"> hier grafik soundso </div> <div class="box"> noch eine Box für impressum </div> </div><!-- #pos_footext ends --> </div><!-- #footer ends --> CSS: #footer { position: relative; margin-top: 80px; height: 101px; border-top: #999999 1px solid; margin-left: 50px; margin-right: 50px; } #pos_footext { margin-left: 160px; } .box { width: 200px; float: left; margin: 20px 0 0 25px; } hth
slateSC The Suntoucher Registered: Jul 2004 Location: oö Posts: 1256	01.12.2010 - 15:41 Danke für eure hilfe! @AbSailer: was meinst du mit der Tabelle? Tabellen hab ich nur im content bereich!? - wennst die krassen farben meinst kommen die natürlich wieder weg! probier das jetzt mal! @die floater: habs mit "float right" probiert, dann springt das impressum zwar an die richtige stelle nach rechts, aber immer noch in der zweiten zeile... Bearbeitet von slateSC am 01.12.2010, 17:05
slateSC The Suntoucher Registered: Jul 2004 Location: oö Posts: 1256	01.12.2010 - 19:26 So ich bin jetzt schon mal was die container im footer bereich betrifft ein ordentliches stückerl weiter! Aber immer noch nicht ganz am ziel... Ich hab jetzt mal versucht deinen quellcode so gut es geht umzusetzen! Aktuell sieht der ganze spaß so aus: Es werden allerdings die grafiken nicht eingefügt und es sollten die beiden boxen der grafiken schmäler sein als die des Impressums. Und wenns geht das ganze rechtsbündig ausgerichtet werden, damit weitere grafiken leichter eingefügt und entfernt werden können ohne die boxen neu auszurichten! ich hab mich jetzt schon mit einer "box2" für das impressum und einem "float right" für die ausrichtung gespielt, allerdings ohne erfolg... Allzuviel kann ja wohl nicht mehr falsch sein!? Hier der code von der index.php: Code: PHP <body> <div id="top-bg"> </div> <div id="bottom-bg"> </div> <div id="stage"> <div id= "header"><jdoc:include type="modules" name="mainmenu" /></div> <div id= "subnavi"><jdoc:include type="modules" name="submenu" /></div> <?php if( $this->countModules('left') ) { ?> <div id= "content-wrapper"> <div id= "sidenav"><jdoc:include type="modules" name="left" /></div> <div id= "content"><jdoc:include type="component" /></div> </div> <?php } else { ?> <div id= "content-wrapper2"> <div id= "content2"><jdoc:include type="component" /></div> </div> <?php } ?> <div id= "clearfloat"></div> <div id="footer"> <div id="pos_footext"> <div class="box"> <img name="" src="../layout/fb.gif" width="20" height="20" alt="FB" /> <!-- hier grafik soundso --> </div> <div class="box"> <img name="" src="../layout/youtube.gif" width="53" height="20" alt="YT" /> <!-- hier grafik soundso --> </div> <div class="box"><jdoc:include type="modules" name="footer" /> <!-- noch eine Box für impressum --> </div> </div><!-- #pos_footext ends --> </div><!-- #footer ends --> </div> </body> Und der ausm css: Code: PHP #footer { position: relative; margin-top: 0px; height: 55px; margin-left: 7px; margin-right: 7px; font-size: 11px; letter-spacing: 2px; background-color:#4d0000; } #footer a:link {color:#ffffff; text-decoration: none; } #footer a:visited {color:#ffffff; text-decoration: none; } #footer a:hover {color:#f96f00; text-decoration: none; } #footer a:active {color:#f96f00; text-decoration: none; } #footer a:focus {color:#ffffff; text-decoration: none; } #pos_footext { margin-left: 600px; } .box { width: 92px; float: left; margin: 20px 0 0 10px; background-color:#009; }
watchout Legend undead Registered: Nov 2000 Location: Off the grid. Posts: 6845	02.12.2010 - 03:43 .box divs raus .pos_footext {text-align: right;} welcher code wird von <jdoc:include type="modules" name="footer" /> eingefügt? das sollte dann natürlich auch ein inline-level element sein. Wenn nicht hast wieder Probleme mit automatischer width tip: display:inline;
slateSC The Suntoucher Registered: Jul 2004 Location: oö Posts: 1256	02.12.2010 - 14:12 hm.. da blick ich jetzt noch immer nicht ganz durch... wenn ich die .box divs raus nehme und den footext auf right stelle wird zwar alles rechts angeordnet, allerdings untereinander! display:inline; sollte diese dann nebeneinander stellen (oder täusch ich mich da jetzt?) Wenn ja; wo muss ich es dann platzieren? wenn ichs in den footer stelle wird der ganze container aufgehoben und wenn ichs in den footext stelle zeigts keine wirkung! Beim <jdoc:include type="modules" name="footer" /> handelt es sich um ein menü aus joomla - da ist allerdings derzeit nur das Impressum drinnen! - wie steck ich das dann genau in welches inline element?
AbSailer boo hoo wendy Registered: Aug 2002 Location: Linz/Stmk Posts: 1160	02.12.2010 - 15:28 Zitat von slateSC So ich bin jetzt schon mal was die container im footer bereich betrifft ein ordentliches stückerl weiter! Aber immer noch nicht ganz am ziel... Ich hab jetzt mal versucht deinen quellcode so gut es geht umzusetzen! Aktuell sieht der ganze spaß so aus: Gibt's da ne Möglichkeit sich diese index.php online in "live" anzusehen, oder seh' ich den link grad nicht? mfG
watchout Legend undead Registered: Nov 2000 Location: Off the grid. Posts: 6845	02.12.2010 - 15:40 Zitat welcher code wird von <jdoc:include type="modules" name="footer" /> eingefügt? display:inline bezieht sich natürlich auf das jeweilige Element, von dem was du oben gepostet hast lässt sich nicht darauf schließen warum das jetzt untereinander angeordnet ist. Aber bitte kein Template-Code und .CSS Auszug mehr, sondern apply und Direktlink zur Seite mit dem Template mit besagtem Problem, dann kann man sich das Problem auch mit den passenden Tools anschaun.
djonny Addicted Registered: Oct 2008 Location: Bgld/W Posts: 598	02.12.2010 - 18:58 Zitat von AbSailer Gibt's da ne Möglichkeit sich diese index.php online in "live" anzusehen, oder seh' ich den link grad nicht? mfG Nein gibt es nicht deswegen fragt er ja bei uns nach weil im XHtml Forum wollten Sie ja auch das er die Seite auf eine Subdomain oder so lädt.... Live wäre das viel besser anzusehen denn im Firefox gibts zB Plugins wo man den Code verändern kann und selber testen kann
watchout Legend undead Registered: Nov 2000 Location: Off the grid. Posts: 6845	02.12.2010 - 19:24 slateSC: Schau mal, wir sind viel lieber als die fiesen von XHTML Forum. Wir zwingen dich nicht eine neue Subdomain dafür einzurichten Mach folgendes: Ruf die Seite auf im Firefox, dann gehts du auf "Datei"->"Seite Speichern unter..." da wählst du dann bei Dateityp "Webseite, komplett" aus und speicherst es in einen Ordner deiner Wahl. Den Ordner zipst du dann und lädst ihn hier hoch oder stellst ihn in einen Unterordner auf deiner Seite bereit, mit Link, damit wir darauf zugreifen können
AbSailer boo hoo wendy Registered: Aug 2002 Location: Linz/Stmk Posts: 1160	02.12.2010 - 21:22 Zitat von djonny Nein gibt es nicht deswegen fragt er ja bei uns nach weil im XHtml Forum wollten Sie ja auch das er die Seite auf eine Subdomain oder so lädt.... Live wäre das viel besser anzusehen denn im Firefox gibts zB Plugins wo man den Code verändern kann und selber testen kann darauf will ich hinaus ohne echte Basis kann man die Lösung ja leider nur vermuten. Und da er was meinte von wegen index.php dachte ich auch dass das ganze Zeug wo online rumsteht... EDIT in anderer Sache: baust du die Website quasi neu auf mit dem Boxmodell? Die alte ist ja "nur" mit Tabellen... wäre die Überlegung nicht das Inhaltsfenster eine spur größer (= höher) zu gestalten? Bearbeitet von AbSailer am 02.12.2010, 21:25
slateSC The Suntoucher Registered: Jul 2004 Location: oö Posts: 1256	09.12.2010 - 00:37 @all: Danke für die Geduld und Hilfsbereitschaft! Ich hab den letzten Stand (siehe oberer post mit screenshot) jetzt mal hier direkt online gestellt. (ich weiß einfach nicht wie ich die ganze Webseite + db. usw. dupliziere und alles andere ist wahrscheinlich auch zu umständlich ) Bzgl. der Frage mit den Tabellen; Im Editor von Joomla, habe ich manche der Seiten bei denen es formatierungstechnisch nötig war (zB.: unter den Projects) auf die guten alten Tabellen zurückgegriffen und werde dies wahrscheinlich auch nicht so schnell ändern, da ich keinen Plan habe wie ich die Formatierungen anders hinbekomme... (wo es leicht ging habe ich sie eh weggelassen) und zwecks der höhe - Schon erledigt Bearbeitet von slateSC am 09.12.2010, 00:48

2x css probleme bei webseite

Forum Index > Software > Coding Stuff

slateSC

Spikx

djonny

Spikx

AbSailer

slateSC

slateSC

watchout

slateSC

AbSailer

watchout

djonny

watchout

AbSailer

slateSC