zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden float left & right

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 17.02.2012, 21:18
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 17.02.2012
Beiträge: 5
basti_ befindet sich auf einem aufstrebenden Ast
Standard float left & right

Hallo,

Erst einmal "HALLO ALLE MITEINANDER".

habe selber gegoogelt und zig ergebnisse gefunden, nur leider nicht eins was mich so richtig weiterbringt.

Ich habe einen Blog und wollte eine "Art" Timeline basteln. Natürlich nicht so Perfekt und js optimiert wie bei Facebook, mehr schlicht und einfach.
Dachte das meine Kenntnisse da ausreichen und das es fix mit CSS fertig ist. xD

Soweit sieht sie ja auch schon ganz gut aus. Nun jetzt zum Problem:

Ich würde gern das die Einträge links und rechts nicht soweit von einander entfernt sind. -> So ist es jetzt

Sondern es soll mehr so aussehen ! -> Den ersten rechten Post nicht beachten

Vielleicht geht es ja doch fix.

vielen Dank schonmal für eure Hilfe

lg basti
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 17.02.2012, 21:29
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 17.02.2012
Beiträge: 5
basti_ befindet sich auf einem aufstrebenden Ast
Standard

ok erster fehler gefunden.

doch nun habe ich das problem, dass er den ersten Beitrag schön links setzt, den zweite rechts, den dritte wieder links doch den vierten auch wieder links

wenn ich nach den ersten beiden ein clear: both setze dann habe ich wieder die unterschiedlich großen Abstände zwischen den Beitägen.

Geändert von basti_ (17.02.2012 um 21:45 Uhr)
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 18.02.2012, 00:07
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 24.06.2010
Beiträge: 528
K.Roland wird schon bald berühmt werden
Standard

Hallo,

bitte erstmal dein HTML einrücken, erleichtert die Lesbarkeit deines Quelltextes. Habe nicht den Nerv danach zu suchen - glaube ich habe 23 DIVs gezählt. Sorry!

___________
Grüß,
Roland
Mit Zitat antworten
  #4 (permalink)  
Alt 19.02.2012, 01:22
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 17.02.2012
Beiträge: 5
basti_ befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von K.Roland Beitrag anzeigen
Hallo,

bitte erstmal dein HTML einrücken, erleichtert die Lesbarkeit deines Quelltextes. Habe nicht den Nerv danach zu suchen - glaube ich habe 23 DIVs gezählt. Sorry!

___________
Grüß,
Roland
Hallo,

dies würde ich gerne machen, doch es ist eine DB abfrage, ich weiß auch nicht wieso er dies immer so durcheinander wurschtelt.

Ich Poste mal den PHP code, vielleicht ist er besser zu verstehen...

PHP-Code:
<html>
  <head>
    <link rel="stylesheet" href="css.css" type="text/css" media="screen" />
  </head>
  <body>
    <div id="site">
      <div id="head">
      </div>
      <div id="line">

  <?php
        
include_once('class/db_class.php');
        include_once(
'function/formattext_func.php');
        include_once(
'function/smily_func.php');
        include_once(
'config.php');  #datenbank daten
        
        //starte Instanz der Klasse
        
$mydb = new datenbank($db_host,$db_name,$db_user,$db_password);
        
$mydb->db_query('SELECT * FROM `name` ORDER BY `time` ASC');
        
        
$number=1;
        
        while(
$row $mydb->db_fetch())
        {
            include(
'../title_bilder.php');
            
$time date("H:i",$row['time']);
            
$date date("d.m.Y",$row['time']);
            
$text $row['text'];
            
            
$linesite $number%2;
            echo 
'<div class="linesite_'.$linesite.'">';
            echo 
'<div class="linesite_inner">';
            echo 
'<div class="boxtitle">'.$row['title'].'  | #'.$row['id'].'</div>';
            echo 
'<div class="right"> '.$date.', '.$time.'h</div>'
            echo 
'<div class="text">'.$text.''.$text2.'</div>';
            echo 
'</div>';
            echo 
'</div>';
            
            
#print_r($row);
            
            
$number++;
        }
        
        
#echo $mydb->count();
  
?>
      </div><!--ende line div -->
    </div><!-- ende site div -->
  </body>
</html>
Was ich halt machen möchte ist, dass der eine Eintrag auf der linken, der andere auf der rechten Seite sich befindet, immer im wechsel. Aber so richtig funktioniert dies nicht.
Der letzte Eintrag müsste auf der rechten Seite stehen, er steht aber auf der linken.
Wenn ich ein clear:both nach den ersten zwei Einträgen (welche float:left und float:right sind) setze, habe ich riesen Lücken und es sieht wieder nicht so schick aus.

ich hoffe man kann mich verstehen.

/* gedanken***
Ich hoffe es gibt eine andere Lösung als alles auf float left zu setzen, nach zwei einträgen ein clear:both und die line per background image... das fällt mir jetzt noch spontan ein. Aber dann brauch ich trotzdem diesen wechsel von links/rechts, da ich eine Art sprechblase noch später mir einbauen wollte, was ja auch nur ein image ist....
***gedanken ende */
Mit Zitat antworten
  #5 (permalink)  
Alt 19.02.2012, 11:48
Benutzerbild von hubspe
Eisen 7 ole....
XHTMLforum-Kenner
 
Registriert seit: 22.06.2007
Ort: Passau
Beiträge: 7.086
hubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblick
Standard

Moin,

als erstes benötigt dein Dokument einen Doctype, damit es nicht im Quirksmode rumeiert.

Du solltest dich auch mal zum Thema Semantik etwas einlesen, weil ein div ist dazu da, um Elemente zusammenzufassen und so zu gruppieren, nicht für alles!
Fließtext wird z.B. mit einem p ausgezeichnet.
__________________
Ein mehrfacher Gruß aus dem Südosten
Klaus
Mit Zitat antworten
  #6 (permalink)  
Alt 19.02.2012, 12:01
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 30.07.2003
Beiträge: 179
Karlo wird schon bald berühmt werden
Standard

Hi,

wenn ich das richtig verstanden hab, ist das so nur mit CSS nicht umsetzbar.

Code:
TEXT1 | TEXT2
        TEXT2
TEXT3 | TEXT4
        TEXT4
        TEXT5
Hinzu kommt noch wenn du Float + Clear benutzt das Abstände entstehen wenn die Artikel nicht die selbe Länge haben.

Was mir spontan einfällt, das ganze als zweispalter, als Liste oder Definationsliste und dann den Wechsel mittels PHP umzusetzen.
__________________
Gruss Karlo
Mit Zitat antworten
  #7 (permalink)  
Alt 19.02.2012, 12:11
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 17.02.2012
Beiträge: 5
basti_ befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von hubspe Beitrag anzeigen
Moin,

als erstes benötigt dein Dokument einen Doctype, damit es nicht im Quirksmode rumeiert.

Du solltest dich auch mal zum Thema Semantik etwas einlesen, weil ein div ist dazu da, um Elemente zusammenzufassen und so zu gruppieren, nicht für alles!
Fließtext wird z.B. mit einem p ausgezeichnet.
Hallo, doctype hatter jetzt, habe in der schnelle nicht daran gedacht.

Ja in der Semantik bin ich nicht so tief drin. Denke aber mal, dass es nicht ganz so schlimm ist mit den Divs, oder?

Zitat:
Zitat von Karlo Beitrag anzeigen
Hi,

wenn ich das richtig verstanden hab, ist das so nur mit CSS nicht umsetzbar.

Code:
TEXT1 | TEXT2
        TEXT2
TEXT3 | TEXT4
        TEXT4
        TEXT5
Hinzu kommt noch wenn du Float + Clear benutzt das Abstände entstehen wenn die Artikel nicht die selbe Länge haben.

Was mir spontan einfällt, das ganze als zweispalter, als Liste oder Definationsliste und dann den Wechsel mittels PHP umzusetzen.
Ja genau, dass ist mein Problem. Werd man was anderes probieren ... Danke erstmal für eure Hilfe soweit.
Mit Zitat antworten
  #8 (permalink)  
Alt 19.02.2012, 16:51
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 17.02.2012
Beiträge: 5
basti_ befindet sich auf einem aufstrebenden Ast
Standard

Danke erstmal für eure Ideen und Antworten...

habe es grob hinbekommen-> hier klick

Habe nun zwei Spalten gebastelt, und mit dem PHP Script nur jeweils den zweiten Eintrag ausgelesen.

Ich hoffe das es nun überhaupt noch eine Daseinsberechtigung in dem Forumsbereich hat .



PHP-Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="de">
  <head>
    <link rel="stylesheet" href="css.css" type="text/css" media="screen" />
  </head>
  <body>
    <div id="site">
      <div id="head">
      </div>
      <div id="line">
      <?php
        
        
include_once('class/db_class.php');
        include_once(
'function/formattext_func.php');
        include_once(
'function/smily_func.php');
        include_once(
'config.php');  #datenbank daten
        
        /*+++++++++++++++++++++++ !IMPORTENT die Klasse muss vor der MYSQL abfrage $gesamtanzahl stehen, sonst kein Datenbankconncet!*/
        //start der ersten Instanz der Klasse
        
$mydb = new datenbank($db_host,$db_name,$db_user,$db_password);
        
//Datenbankabfrag für die links Seite
        // mit WHERE (Modulus) = 0 um nur jeden zweiten Eitrag zubekommen
        
$mydb->db_query('SELECT * FROM `miri_blogtext_backup` WHERE ( id % 2 ) = 0 ORDER BY `time` DESC');
        
        
//anzahl aller Einträge abfragen / ich benutze ihn für testzwecke. Könnte aber auch interessant sein
        
$gesamtanzahl mysql_num_rows(mysql_query('SELECT * FROM `miri_blogtext_backup`'));
        
/*+++++++++++++++++++++++ !IMPORTENT die Klasse muss vor der MYSQL abfrage $gesamtanzahl stehen, sonst kein Datenbankconncet!*/
      
?>
        <div id="left">
        <?php
                    
          $number
=$gesamtanzahl//dient nur zu testzwecken!
          
while($row $mydb->db_fetch())
          {
              
              include(
'../title_bilder.php');
      
              
$time date("H:i",$row['time']);
              
$date date("d.m.Y",$row['time']);
              
$text formatText($row['text']);
              
              echo 
'<div class="linesite_inner">';
              echo 
'<p class="boxtitle">'.$row['title'].'  | #'.$number.' | #'.$row['id'].'</p>'//hier findet der Test statt
              
echo '<p class="right"> '.$date.', '.$time.'h</p>'
              echo 
'<p class="text">'.$text.''.$text2.'</p>';
              echo 
'</div>';
              
              
#print_r($row);  
              
$number=$number-2;
          }
          
?>
        </div>
        <div id="right">
          <?php
          
//start der zweiten Instanz der Klasse
          
$mydb2 = new datenbank($db_host,$db_name,$db_user,$db_password);
          
          
//Datenbankabfrag für die links Seite
          // WHERE (Modulus) = 1 um nur jeden zweiten Eitrag zubekommen
          
$mydb2->db_query('SELECT * FROM `miri_blogtext_backup` WHERE ( id % 2 ) = 1 ORDER BY `time` DESC'); 
          
          
$number2=$gesamtanzahl-1
          while(
$row2 $mydb2->db_fetch())
          {
              
              include(
'../title_bilder.php');
              
              
$time date("H:i",$row2['time']);
              
$date date("d.m.Y",$row2['time']);
              
$text formatText($row2['text']);
              
              echo 
'<div class="linesite_inner">';
              echo 
'<p class="boxtitle">'.$row2['title'].'  | #'.$number2.'| '.$row2['id'].'</p>';
              echo 
'<p class="right"> '.$date.', '.$time.'h</p>'
              echo 
'<p class="text">'.$text.''.$text2.'</p>';
              echo 
'</div>';
              
              
#print_r($row);
              
              
$number2=$number2-2;
          }
          
?>
        </div>
      </div><!--ende line div -->
    </div><!-- ende site div -->
  </body>
</html>
Sind die <p>´s richtig gesetzt? Danke auch für diesen Tip!

Hat jemand zufällig eine Idee, wie man es Scripttechnisch verhinder kann, dass irgendwann die Inhalte der zwei Spalten, durch unterschiedlich große Beiträge, zu stark von einander abweichen?
Mit Zitat antworten
  #9 (permalink)  
Alt 19.02.2012, 17:12
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 30.07.2003
Beiträge: 179
Karlo wird schon bald berühmt werden
Standard

Hi,

hab ich so auf die schnelle gefunden: Darstellung von mysql Daten

vielleicht kannste damit was anfangen. Leider basiert das da noch auf Tabellen, wie das da umgebaut werden muss kann ich dir nicht sagen. Ansonsten musste mal selber googeln, da gibt es sicher auch andere Möglichkeiten.
__________________
Gruss Karlo
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
CSS - CMS - lange Menus Balken/BG oben? shinobi CSS 3 13.10.2011 22:12
Webseite für Smartphones Optimieren. Cybertronic CSS 8 25.08.2011 12:44
Webseite für Smartphones Optimieren Cybertronic CSS 8 18.08.2011 10:16
Frage zu horizontalen Linien marvin1989 CSS 3 30.12.2009 00:35
Mozilla zeigt DIV zu oft an cracki CSS 6 09.03.2008 16:22


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