php-resource



Zurück   PHP-Scripte PHP-Tutorials PHP-Jobs und vieles mehr > Entwicklung > HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS
 

Login

 
eingeloggt bleiben
star Jetzt registrieren   star Passwort vergessen
 

 

 


HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS Probleme mit HTML5, Bootstrap oder jQuery ?

Antwort
 
LinkBack Themen-Optionen Thema bewerten
  #16 (permalink)  
Alt 17-07-2011, 14:24
medium22
 Registrierter Benutzer
Links : Onlinestatus : medium22 ist offline
Registriert seit: Mar 2006
Beiträge: 308
medium22 zeigte ein beschämendes Verhalten in der Vergangenheit
Standard

Hallo,

Ziel ist es, den Inhalt des jeweils innersten div-Elements (pos2) mittig & bottom zu positionieren. Ich kann mit den Positionen hin & her testen (im Beispiel entfernt) wie ich will, es verändert sich immer etwas, nur nicht dort hin wo ich es gerne hätte. Kann doch irgendwie nicht so schwierig sein den Inhalt zu positionieren, oder?


HTML-Code:
<div id="sm_box2">
  <div id="pos1">
    <div id="pos2">
      <img src="s/a.gif" alt=""> Beschreibung A
    </div>
  </div>
  <div id="pos1">
    <div id="pos2">
      <img src="s/b.gif" alt=""> Beschreibung B
    </div>
  </div>
  <div id="pos1">
    <div id="pos2">
      <img src="s/c.gif" alt=""> Beschreibung C
    </div>
  </div>
</div>
Code:
#sm_box2 {
  // height: 100;
  height: 100px; 
  width: 456px;
  max-height: 100px;
  max-width: 456px;
  border: 0px;
  margin: 1px;
}
#sm_box2 #pos1 {
  float: left;
  // height: 100;
  height: 100px;
  width: 150px;
  max-height: 100px;
  max-width: 150px;
  border: 0px; 
  overflow: visible;
  margin: 0;
}
#sm_box2 div:hover {
  float: left;
  background-color: #EAD9F7;
}
#sm_box2 #pos1 #pos2 {
  height: 100px;
  width: 150px;
  // text-align: bottom;
  padding: 0;
}
Sowohl lt. Firebug als auch selfhtml-validator (4.01 Strict) keine Fehler vorhanden, valide ist das also schonmal - was in der Vergangenheit wohl zu Fehlern geführt hat.

Edit: 3 CSS-Fehler auskommentiert & behoben

Geändert von medium22 (17-07-2011 um 14:54 Uhr)
Mit Zitat antworten
  #17 (permalink)  
Alt 17-07-2011, 14:33
wahsaga
  Moderator
Links : Onlinestatus : wahsaga ist offline
Registriert seit: Sep 2001
Beiträge: 25.236
wahsaga befindet sich auf einem aufstrebenden Ast
Standard

Validiere bitte dein CSS ebenfalls - The W3C CSS Validation Service

Außerdem ist die Mehrfach-Verwendung von IDs in einem Dokument selbstverständlich nicht valide. Sollten dir deine verwendeten Validatoren diesen Fehler nicht anzeigen, verwende bitte auch für die Validierung deines HTMLs den offiziellen Validator des W3C, The W3C Markup Validation Service
__________________
I don't believe in rebirth. Actually, I never did in my whole lives.

Geändert von wahsaga (17-07-2011 um 14:36 Uhr)
Mit Zitat antworten
  #18 (permalink)  
Alt 17-07-2011, 14:48
medium22
 Registrierter Benutzer
Links : Onlinestatus : medium22 ist offline
Registriert seit: Mar 2006
Beiträge: 308
medium22 zeigte ein beschämendes Verhalten in der Vergangenheit
Standard

3 Fehler im CSS behoben.
Wie meinst du das mit Mehrfachwendung? Das man zb. 'pos1' nur einmal verwenden darf und nicht öfters?
Mit Zitat antworten
  #19 (permalink)  
Alt 17-07-2011, 14:55
wahsaga
  Moderator
Links : Onlinestatus : wahsaga ist offline
Registriert seit: Sep 2001
Beiträge: 25.236
wahsaga befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von medium22 Beitrag anzeigen
3 Fehler im CSS behoben.
Ist damit noch irgendwas übrig geblieben, das dafür sorgen könnte, dass die Inhalte wie gewünscht „unten“ positioniert werden?

Zitat:
Wie meinst du das mit Mehrfachwendung? Das man zb. 'pos1' nur einmal verwenden darf und nicht öfters?
Ja, natürlich. http://de.selfhtml.org/html/attribut...htm#uebersicht

Gerade noch mal getestet - auch der SELFHTML-Validator unter http://validator.de.selfhtml.org/ (ich nehme an, du meintest diesen?) weißt auf einen solchen Fehler hin. Wieso du dann behauptest, der hätte dein Dokument als valide bezeichnet, verstehe ich ehrlich gesagt nicht ...
__________________
I don't believe in rebirth. Actually, I never did in my whole lives.
Mit Zitat antworten
  #20 (permalink)  
Alt 17-07-2011, 15:06
medium22
 Registrierter Benutzer
Links : Onlinestatus : medium22 ist offline
Registriert seit: Mar 2006
Beiträge: 308
medium22 zeigte ein beschämendes Verhalten in der Vergangenheit
Standard

Weil diese Inhalte dynamisch erzeugt / ausgegeben werden und ich mit jenem Dokument den Test gemacht habe - dementsprechend hatte es dort auch keinen Inhalt, da dieser erst nach Auswahl in einer Select-Box kommt. Für den Beitrag hier habe ich diese Inhalte dann manuel eingefügt um die Fehlerzone aufzeigen zu können.

Ebenso schrieb ich, dass ich das ganze Positionierungs-Zeugs aus dem Beispiel entfernt habe.


Aber wenn eine Mehrfachverwendung nicht möglich ist, muss ich mir sowieso Gedanken über eine andere Lösung machen. Die Anzahl der div's (also des Inhaltes) ist nicht festgelegt und ändert sich je nach Anzahl der darin enthaltenen Grafiken welche dynamisch (mit JS) eingefügt werden.

Hättest du eine Idee oder einen Ansatz wie man das lösen kann?
Ich kann aber leider kein Onlinebeispiel öffentlich posten (ich habe (noch) keine Rechte an den Inhalten, bzw. darf diese noch nicht veröffentlichen). Alternativ kann ich dir aber anbieten, dir ein Beispiel per PM zukommen zu lassen.
Mit Zitat antworten
  #21 (permalink)  
Alt 17-07-2011, 15:16
wahsaga
  Moderator
Links : Onlinestatus : wahsaga ist offline
Registriert seit: Sep 2001
Beiträge: 25.236
wahsaga befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von medium22 Beitrag anzeigen
Aber wenn eine Mehrfachverwendung nicht möglich ist, muss ich mir sowieso Gedanken über eine andere Lösung machen. Die Anzahl der div's (also des Inhaltes) ist nicht festgelegt und ändert sich je nach Anzahl der darin enthaltenen Grafiken welche dynamisch (mit JS) eingefügt werden.
Erst mal überlegen, ob diese Elemente überhaupt eine ID brauchen.

Und auch beim dynamischen Ausgaben von Elementen mit PHP sollte es kein großes Problem darstellen, einen Zähler mitlaufen zu lassen, und den an ein ID-Präfix anzuhängen, so dass du letztendlich „durchnummerierte“ IDs heraus bekommst.
__________________
I don't believe in rebirth. Actually, I never did in my whole lives.
Mit Zitat antworten
  #22 (permalink)  
Alt 17-07-2011, 20:15
medium22
 Registrierter Benutzer
Links : Onlinestatus : medium22 ist offline
Registriert seit: Mar 2006
Beiträge: 308
medium22 zeigte ein beschämendes Verhalten in der Vergangenheit
Standard

Hm.., ja. Das hatte ich auch schon. Aber auch da hatte es nicht so wirklich geklappt. Habe nun einfach die beiden div-Bereich im CSS gelöscht und nochmal neu aufgebaut. Manchmal ist der Baum doch näher als man denkt.

Code:
#sm_box2 {
  height: 100px;
  width: 456px;
  max-height: 100px;
  max-width: 456px;
  border: 0px;
  margin: 0;
}
#sm_box2 div {
  position: relative;
  float: left;
  height: 100px;
  width: 150px;
  max-height: 100px;
  max-width: 150px;
  border: 0px; 
  overflow: visible;
  margin: 0;
}
#sm_box2 div:hover {
  float: left;
  background-color: #EAD9F7;
}
#sm_box2 div div {
  height: auto;
  position: absolute;
  left: auto;
  bottom: 0;
  padding-bottom: 5px
}
Damit wird unten mittig positioniert.
Mit Zitat antworten
Antwort

Lesezeichen


Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)
 

Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Termine wiederholen smartmusic SQL / Datenbanken 2 15-07-2009 15:24
Formular oder Grafik beliebig automatisch wiederholen CosmoPhobia PHP Developer Forum 11 26-03-2008 18:44
Passwort wiederholen janrichter PHP Developer Forum 1 26-05-2006 22:00
hintergrundfarbe wiederholen SOB22 HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS 7 08-10-2004 11:58
bereich wiederholen glitzer HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS 6 22-05-2004 13:44

Themen-Optionen
Thema bewerten
Thema bewerten:

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 an


PHP News

ebiz-trader 7.5.0 mit PHP7 Unterstützung veröffentlicht
ebiz-trader 7.5.0 mit PHP7 Unterstützung veröffentlichtDie bekannte Marktplatzsoftware ebiz-trader ist in der Version 7.5.0 veröffentlicht worden.

28.05.2018 | Berni

Wissensbestand in Unternehmen
Wissensbestand in UnternehmenLebenslanges Lernen und Weiterbilden sichert Wissensbestand in Unternehmen

25.05.2018 | Berni


 

Aktuelle PHP Scripte

Top-Side Guestbook

Gästebuch auf Textbasis (kein MySQL nötig) mit Smilies, Ip Sperre (Zeit selbst einstellbar), Spamschutz, Captcha (Code-Eingabe), BB-Code, Hitcounter, Löschfunktion, Editierfunktion, Kommentarfunktion, Kürzung langer Wörter, Seiten- bzw. Blätterfunktion, V

22.10.2018 webmaster10 | Kategorie: PHP/ Gaestebuch
ebiz-trader 6.0 - Das professionelle PHP Marktplatz Script ansehen ebiz-trader 6.0 - Das professionelle PHP Marktplatz Script

Mit unserer Lösungen können Sie nahezu jeden B2B / B2C Marktplatz betreiben den Sie sich vorstellen können. Ganz egal ob Sie einen Automarktplatz, Immobilenportal oder einfach einen Anzeigenmarkt betreiben möchten. Mit ebiz-trader können Sie Ihre Anforder

11.10.2018 Berni | Kategorie: PHP/ Anzeigenmarkt
PHP Server Monitor

PHP Server Monitor ist ein Skript, das prüft, ob Ihre Websites und Server betriebsbereit sind.

11.09.2018 Berni | Kategorie: PHP/ Security
 Alle PHP Scripte anzeigen

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