zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Drei Spalten Problem Numero DUO

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 13.04.2008, 16:21
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.04.2008
Beiträge: 8
pizko befindet sich auf einem aufstrebenden Ast
Standard Drei Spalten Problem Numero DUO

Hi Leute, Ich komme einfach nicht weiter.. seit einem Tag hänge ich schon dran... Mein Shop Forum konnte auch nicht helfen.. Deshalb wende ich mich an Euch..

Ich wollte aus einer dynamischen Seite eine mit festen Größen machen , um es für alle Kunden mit verschiedenen Browsern und Browsergrößen den Shop gleichermaßen verfügbar zu machen.. Ich war kurz vorm Ziel (schon mehrmals) aber dann ist mir immer noch ein Fehler beim IE oder beim FF aufgefallen.. Jetzt mach ich alles neu..

Also im Moment stehe ich hier(Der rechte container ist unter die anderen beiden gerutscht...):

PHP-Code:
<div id="wholepage">

    <
div id="head">

        <
div id="headlogo">
            
            <
div id="navbartop">
            <
div id="navtrail">
                {
$navtrail}
            </
div><!-- id=navtrail -->

            <
div id="navbarlinks">
                
            </
div><!-- id=navbarlinks -->

        </
div><!-- id=navbartop -->

    </
div><!-- id=head -->

    <
div id="navbargradient">
        &
nbsp;
    </
div><!-- id=navbargradient -->

    <
div id="left">
        {
$box_CATEGORIES}
        {
$box_SEARCH}
        {
$box_MANUFACTURERS_INFO}
        {
$box_MANUFACTURERS}
        {
$box_ADD_QUICKIE}
        {
$box_REVIEWS}
        {
$box_CONTENT}
        {
$box_LAST_VIEWED}
        {
$box_SPECIALS}
        {
$box_WHATSNEW}
    </
div><!-- id=left -->
    
    <
div id="content">
        {
$main_content}
    </
div><!-- id=content -->

    <
div id="right">
        {
$box_LANGUAGES}
        {
$box_CURRENCIES}
        {
$box_INFORMATION}
        {
$box_LOGIN}
        {
$box_ADMIN}
        {
$box_NEWSLETTER}
        {
$box_INFOBOX}
        {
$box_BESTSELLERS}
    </
div><!-- id=right -->

    

    <
div id="foot">
        {if 
$BANNER}
            <
div class="center">
                {
$BANNER}
            </
div>
        {/if}
    </
div><!-- id=foot -->

</
div><!-- id=wholepage -->

<
div class="copyright2">
        <
a href="http://www.web4business.ch/"
            
title="Web4Business Website" onclick="window.open(this.href);return false;"
            
>Design Copyright Web4Business GmbH &ndashDesigns &ndashModules</a>
</
div
Meine CSS(die Teile die ich für wichtig halte, in dieser Reihenfolge):
Code:
/* default common settings */

body {
float:left;
	color: black;
	background-color: white;
	font-family: Verdana, Helvetica, sans-serif;
	font-size: 0.7em;
	margin: 0;
	padding: 0;
	line-height: 1.5em; /* change this value to 1.25em to reset default */
	margin-bottom: 1em; /* give room at bottom of page */
	cursor: default; /* remove text I cursor when mouse is over text */
	background-image: url(img/gradientlightblue.png);
	background-position: center bottom;
	background-attachment: fixed;
	background-repeat: repeat-x;
}



* html body {
	margin-right: 1px; /* IE 5.5 and 6.0 star-hack to remove horizontal scrollbar if possible */
}

div#wholepage {
	padding-top: 12.5em;
		
}


/* head */

div#head {
	width:1050px;
	padding: 10px;
	text-align: right;
	height: 13em;
	background-repeat: no-repeat;
	
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1000;
}

* html div#head { /* IE6 hack */
	position: absolute;
}

div#left {
float:left;
	width: 17em;
	position: absolute;
	left: 10px;
	padding-top: 1px;
	padding-bottom: 5em;
	margin-top: 3.3em;
}

div#left div.box_top, div#right div.box_top {
	border: 1px solid #ffcc00;
	border-bottom-width: 0;
}

div#left div.box_content, div#right div.box_content {
	margin-top:o.27em;
	background-color: white;
	background-image: url(img/gradientlightbluesmall.png);
	background-repeat: repeat-x;
	background-position: center bottom;
	border: 1px solid #91C6DF;
	border-top-width: 0;
}

* html div#left { /* IE 6 hack */
	position: static;
	float:left;
	margin-left: 10px;
}

div#right {
float:left;
	width: 13.6em;
	
	
	padding-top: 1px;
	padding-bottom: 5em;
	margin-top: 3.3em;
}
Vorher war die Reihenfolge folgende:
left
right
content

Geändert von pizko (14.04.2008 um 11:45 Uhr)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 13.04.2008, 16:27
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.775
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Bitte poste keinen ungeparsten Code, das bringt nichts. Einen Link. Siehe auch: http://xhtmlforum.de/40080-f-r-frage...twortende.html

Float lässt nachfolgende Inhalte ausweichen, nicht vorhergehende. Die geänderte Reihenfolge ist also vermutlich die Ursache deines Problems.
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 13.04.2008, 16:31
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.04.2008
Beiträge: 8
pizko befindet sich auf einem aufstrebenden Ast
Standard

sorry aber was heißt geparst.. Bin ein absoluter Neuling was solche Begriffe angeht

Hab doch denke ich alles so wie beschrieben aufgeführt, oder?
Mit Zitat antworten
  #4 (permalink)  
Alt 13.04.2008, 16:35
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.775
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Was du hier postest ist kein HTML, sondern Code, der serverseitig verarbeitet wird. Das interessiert hier nicht. Hier muss das HTML her, kein PHP, keine Template-Variablen.
Lies den von mir geposteten Link. Poste einen Link.
Mit Zitat antworten
  #5 (permalink)  
Alt 13.04.2008, 16:37
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.04.2008
Beiträge: 8
pizko befindet sich auf einem aufstrebenden Ast
Standard

das ist die index.html.. soll ich die php Fetzen da raus löschen??

Geändert von pizko (13.04.2008 um 16:45 Uhr)
Mit Zitat antworten
  #6 (permalink)  
Alt 13.04.2008, 16:38
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.775
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Was genau verstehst du an dem Satz "poste einen Link" nicht?
Mit Zitat antworten
  #7 (permalink)  
Alt 13.04.2008, 16:46
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.04.2008
Beiträge: 8
pizko befindet sich auf einem aufstrebenden Ast
Standard

Ja sorry ohne Seite wirds schwierig.

Hab die Reihenfolge wieder auf Ursprung gesetzt..

Geändert von pizko (14.04.2008 um 11:45 Uhr)
Mit Zitat antworten
  #8 (permalink)  
Alt 13.04.2008, 16:48
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.775
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Schön, jetzt gibt es also einen Link.
Geh dort mit deinem Browser hin. Klicke mit der rechten Maustaste und wähle "Quelltext anzeigen". Was du dann siehst, ist HTML. Vergleiche es mit dem, was du gepostet hast. Jetzt weißt du, was ungeparster Code ist.

Dein Link zeigt das Problem nicht. Die rechte Spalte liegt rechts, nicht unten.
Ich habe dir bereits gesagt, welche Relevanz die Reihenfolge bei Float hat.
Was willst du jetzt noch wissen?
Mit Zitat antworten
  #9 (permalink)  
Alt 13.04.2008, 17:02
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.04.2008
Beiträge: 8
pizko befindet sich auf einem aufstrebenden Ast
Standard

Ich hab Sie nochmal vereinfacht.. Wie könnte ich left right und content anpassen, damit Sie nebeneinander stehenbleiben??

Ich hatte float rechts für die rechte box, deshalb stand sie rechts! Jetzt bei float links wie oben angegeben überlappt die Box

wholepage ne feste Breite zu geben bringt nichts.. ebenso body..
Ich dachte da wholepag die Boxen umgibt kann man so alle einzwängen sozusagen!

Geändert von pizko (13.04.2008 um 17:05 Uhr)
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 13.04.2008, 17:09
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.775
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Ich habe den Eindruck, du fischst absolut im Trüben.
Bitte eigne dir zunächst Grundlagen an, ehe du dich daran wagst, ein Template für andere zu erstellen.
Grundlagenworkshops: CSS 4 You - The Finest in Stylesheets: Workshops

Du willst ein Layout mit fester Breite? Dann gib dem Element, das alles umfasst, eine feste Breite.
Du willst eine Spalte am rechten Rand? Nun, float:right ist doch ein naheliegender Versuch, oder nicht?
Du willst, dass deine Spalten in eine feste Breite hineinpassen? Dann vergib Breiten, die zueinanderpassen. Deine Mischung aus em und px wird so nicht funktionieren.

Ehe du aber irgendwelche weiteren Versuche startest, statte bitte v.a. dem CSS-Validator einen Besuch ab und beseitige deine Syntaxfehler.
Mit Zitat antworten
Sponsored Links
Antwort

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
Problem mit 3-spaltigem Layout im Firefox Imhotep CSS 4 08.07.2008 18:17
3 Spalten Layout, Problem mit IE 6 schmidtsmikey CSS 10 18.05.2008 19:54
mitwachsender Menüblock AUF mitgewachsenen Spalten Fips01 CSS 13 14.04.2008 19:19
Problem mit 3 Spaltigem Layout stipo CSS 0 27.05.2006 21:58
css layout problem (4 spalten / chat) scorpion4000 CSS 5 02.04.2005 23:50


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