html frage

Dieses Thema im Forum "Sonstiges" wurde erstellt von kimi, 04.09.2008.

  1. kimi

    kimi blub

    Dabei seit:
    20.12.2006
    Beiträge:
    425
    Zustimmungen:
    0
    Ort:
    Tuttlingen
    he leute,

    ich weiß nich, ob das unterforum richtig is, sonst auch gerne verschieben...

    zu meiner frage:
    ich will ein bild auf einer homepage genau mittig ausrichten, und zwar in der mitte des vorher definierten div#inhalt.

    das ganze sieht so aus:
    Code:
    div#inhalt {
    		margin-top:50px;
    		margin-right:1em;
    		margin-left:250px;
    		} 
    und
    Code:
    <DIV id="inhalt">
    <br>
    <br>
    
    <div align="center"><IMG src="images/orchester.png" alt="Altes Foto des Kammerorchesters" width="400" height="246" align="left" border="0"></div>
    
    
    	</DIV>
    
    nur das
    Code:
    <div align="center">
    tut nicht das, was ich will... wahrscheinlich liegts an mir?

    was muss ich also anstellen, um das foto in die mitte zu prügeln?
    wäre nett,

    grüße,
    kimi
     
  2. Anzeige

    Schau dir mal diese Kategorie an. Dort findest du bestimmt etwas.
    Registrieren bzw. einloggen, um diese und auch andere Anzeigen zu deaktivieren
  3. .mike.

    .mike. Doppel-As

    Dabei seit:
    27.08.2006
    Beiträge:
    207
    Zustimmungen:
    0
    kanns dir zwar auch nicht so ausm stegreif sagen, aber ich hab zum testen bei jedem div noch ein "border: 1px solid black;"
    dann sieht man genau wie die divs liegen
    vlt hilfts ja
     
  4. kimi

    kimi blub

    Dabei seit:
    20.12.2006
    Beiträge:
    425
    Zustimmungen:
    0
    Ort:
    Tuttlingen
    wie meine divs liegen, weiß ich. trotzdem danke.
    gruß,
    kimi
     
  5. #4 slackfan, 04.09.2008
    Zuletzt bearbeitet: 04.09.2008
    slackfan

    slackfan König

    Dabei seit:
    18.04.2006
    Beiträge:
    809
    Zustimmungen:
    0
    Ort:
    Bonn
    Hallo,

    hier ist ein volles Beispiel:

    cu
     
  6. kimi

    kimi blub

    Dabei seit:
    20.12.2006
    Beiträge:
    425
    Zustimmungen:
    0
    Ort:
    Tuttlingen
    danke, hat sich soweit erledigt.
    die kombination von
    Code:
    <div align="center">
    und
    Code:
    align="top"
    hat genau das erwünschte gebracht.
    trotzdem danke,
    grüße,
    kimi
     
  7. #6 slackfan, 04.09.2008
    slackfan

    slackfan König

    Dabei seit:
    18.04.2006
    Beiträge:
    809
    Zustimmungen:
    0
    Ort:
    Bonn
    Das geht natürlich auch, ist aber ungefähr so stylish wie Omas Wärmflasche ;)
     
  8. #7 Bâshgob, 04.09.2008
    Bâshgob

    Bâshgob freies Radikal

    Dabei seit:
    29.07.2004
    Beiträge:
    2.334
    Zustimmungen:
    0
    Ort:
    Hannover
    Hey, die Wärmflasche von meiner Oma ist absolut stylisch. Und simple Lösungen sind oft besser als komplizierte.
     
  9. #8 Wolfgang, 04.09.2008
    Wolfgang

    Wolfgang Foren Gott

    Dabei seit:
    24.04.2005
    Beiträge:
    3.978
    Zustimmungen:
    0
    Ort:
    Erfurt
    Ich schieb es mal in die einzig zutreffende Kategorie.

    BTW Absolute Positionierung ist immer so eine Sache - wo oft der Blick auf andere Bildschirmgrößen aus der Strecke bleibt.
    Aber zum Glück hat der User ja die möglichkeit von diversen Webangeboten ganz flink Abschied für immer zu nehmen. ;)
     
  10. #9 slackfan, 05.09.2008
    slackfan

    slackfan König

    Dabei seit:
    18.04.2006
    Beiträge:
    809
    Zustimmungen:
    0
    Ort:
    Bonn
    Darum steckt es ja im CSS :)
    Das kann man abschalten oder anpassen, und alles läuft so wie gewünscht. Ich sag nur Model, View, Controller...
     
  11. kimi

    kimi blub

    Dabei seit:
    20.12.2006
    Beiträge:
    425
    Zustimmungen:
    0
    Ort:
    Tuttlingen
    hm also bei mir funktioniert das ganz gut, und vor allem es wird auch bei verschiedenen auflösungen bzw fenstergrößen in die Mitte plaziert... das ist auch ein effekt, gegen den ich absólut nichts habe...
    allerdings würde mich schon interessieren, was hat html mit hardware zu tun (unterforum)?
    vielleicht stehe ich nur auf dem schlauch und jemand kanns mir erklären...^
    grüße
    kimi
     
  12. #11 Wolfgang, 05.09.2008
    Wolfgang

    Wolfgang Foren Gott

    Dabei seit:
    24.04.2005
    Beiträge:
    3.978
    Zustimmungen:
    0
    Ort:
    Erfurt
    Weil es in keine Kategorie passt (Programmieren != html) und es sonst nirgends ein sonstiges gibt, habe ich das hier hin geschoben und dabei auf die Oberkategorie gesch*.

    Mit Netzwerkproblemen hat es jedenfalls nix gemein.
     
  13. Anzeige

    Vielleicht findest du HIER Antworten.
    Registrieren bzw. einloggen, um diese und auch andere Anzeigen zu deaktivieren
  14. kimi

    kimi blub

    Dabei seit:
    20.12.2006
    Beiträge:
    425
    Zustimmungen:
    0
    Ort:
    Tuttlingen
    @wolfgang:
    leuchtet ein...

    ich würde mich gleich noch mit einer weiteren frage an:
    ich habe folgende Unterseite:
    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 profile="http://www.w3.org/2005/10/profile">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    
    <title>
    	Tuttlinger Kammerorchester - Bildergalerie
    	</title>
    
    <link rel="icon" 
          type="image/x-icon" 
          href="/images/icon.ico" />
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <meta name="generator" content="Jalbum 8.0 with the ImageFlow 2 skin"/>
    <meta name="keywords" content=""/>
    <meta name="copyright" content="2008"/>
    <style type="text/css">
    body{
    	width:100%;
    	height:100%;
    	margin:0;
    	padding:0
    }
    body{
    	background:#111;
    	color:#fff;
    	font:80%/120% "Lucida Grande",Geneva,Arial,Verdana,sans-serif;
    }
    a{color:#fff;padding:1em;}
    a:hover{color:#888;}
    #demo {
    	width:800px;
    	margin:1em auto;
    	text-align:left;
    }
    </style>
    <link href="../res/css/MooFlowDemo.css" rel="stylesheet" type="text/css" />
    <link href="../res/css/MooFlow.css" rel="stylesheet" type="text/css" />
    <link href="../res/ReMooz/ReMooz.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" type="text/css" href="../res/css/style2.css" />
    <script type="text/javascript" src="../res/js/script.js"></script>
    <script type="text/javascript" src="../res/js/mootools-1.2-core.js"></script>
    <script type="text/javascript" src="../res/js/mootools-1.2-more.js"></script>
    <script type="text/javascript" src="../res/js/MooFlow.js"></script>
    <script type="text/javascript" src="../res/ReMooz/ReMooz.js"></script>
    <script type="text/javascript" src="../res/js/demo.js"></script>
    <script type="text/javascript">
    var myMooFlowPage = {
    
    	start: function(){
    	
    		var mf = new MooFlow($('MooFlow'), {
    			startIndex: 0,
    			reflection: 0.40,
    			heightRatio: 0.6,
    			interval: 3000,
    			bgColor: '#000',
    			useSlider: true,
    			useAutoPlay: true,
    			useCaption: true,
    			useResize: true,
    			useWindowResize: false,
    			useMouseWheel: true,
    			useKeyInput: true,
    			useViewer: true,
    			onClickView: function(obj){
    				var img = new Element('img',{src:obj.src, title:obj.title, alt:obj.alt, styles:obj.coords}).setStyles({'position':'absolute','border':'none'});
    				var link = new Element('a',{'class':'remooz-element','href':obj.href,'title':obj.title + ' - '+ obj.alt, styles:{'border':'none'}});
    				document.body.adopt(link.adopt(img));
    				var remooz = new ReMooz(link, {
    		            centered: true,
    					resizeFactor: 0.8,
    		            origin: link.getElement('img'),
    					onCloseEnd: function(){link.destroy()}
    		        });
    				remooz.open();
    			}
    		});
    		$$('.loadremote').addEvent('click', function(){
    			mf.loadHTML(this.get('href'), this.get('rel'));
    			return false;
    		});
    	}
    	
    };
    
    window.addEvent('domready', myMooFlowPage.start);
    </script>
    
    
    
    
    <link rel="alternate" href="album.rss" type="application/rss+xml"/>
    </head>
    <body onload="menuSlider.init('menu','slide')">
    <div id="header"><h3>Bilder</h3> </div>
    <div id="content">
    
    <div class="menu">
     <ul id="menu">
    				
    				<li>
                        <!-- up --> <a href="../../multimedia.html">Zur&uuml;ck zu "Multimedia"</a>
    					</li>
                        
    <!-- Create navigation buttons if more than one index page -->
    
     </ul>
       <div id="slide"><!-- --></div>
    </div>
    
    <noscript>
        <div style="color:#000;text-align:center;width:100%;position:absolute;top:200px">
        You really, really need to enable JavaScript to view this page.<br/>
        You know, it's about JavaScript.<br/>
        <br/>
        And it will make your life much easier, but it's up to you.
        </div>
      </noscript>
    <div  id="MooFlow">
        
    	<a href="slides/1970.jpg"  rel="image"><img src="slides/1970.jpg"  title="1970:  Konzert in der Aula der Gymnasien - 1970" alt="1970:  Konzert in der Aula der Gymnasien - 1970"/></a>
    	<a href="slides/Abschied von H.jpg"  rel="image"><img src="slides/Abschied von H.jpg"  title="Abschied von H:  Abschied von H" alt="Abschied von H:  Abschied von H"/></a>
    	<a href="slides/Dezember 1990.jpg"  rel="image"><img src="slides/Dezember 1990.jpg"  title="Dezember 1990:  Erstes Konzert unter Bärbel Gall - Dezember 1990" alt="Dezember 1990:  Erstes Konzert unter Bärbel Gall - Dezember 1990"/></a>
    	<a href="slides/1993.jpg"  rel="image"><img src="slides/1993.jpg"  title="1993:  Ausflug nach Bex 1993" alt="1993:  Ausflug nach Bex 1993"/></a>
    	<a href="slides/1994.jpg"  rel="image"><img src="slides/1994.jpg"  title="1994:  Probenwochenende auf dem Wildenstein - September 1994" alt="1994:  Probenwochenende auf dem Wildenstein - September 1994"/></a>
    	<a href="slides/Oktober 1998.jpg"  rel="image"><img src="slides/Oktober 1998.jpg"  title="Oktober 1998:  Oktober 1998" alt="Oktober 1998:  Oktober 1998"/></a>
    	<a href="slides/2. 12.jpg"  rel="image"><img src="slides/2. 12.jpg"  title="2. 12:  Probe mit Jordi Altimira - 2. 12" alt="2. 12:  Probe mit Jordi Altimira - 2. 12"/></a>
    	<a href="slides/2003.jpg"  rel="image"><img src="slides/2003.jpg"  title="2003:  Jubiläumskonzert 50 Jahre 19. 10" alt="2003:  Jubiläumskonzert 50 Jahre 19. 10"/></a>
    	<a href="slides/21. 7.jpg"  rel="image"><img src="slides/21. 7.jpg"  title="21. 7:  Das Orchester in der Wilhelmschule, wo es auch probt" alt="21. 7:  Das Orchester in der Wilhelmschule, wo es auch probt"/></a>
        </div>
    	<h3 class="info"><a><img src="res/help.png" alt="Hilfe zur Galerie" width="16" height="16" align="middle" /></a></h3>
        <p id="info"><em><div id="info2">
        <p>Um ein Bild in voller Größe zu sehen, doppelklicken Sie darauf. Um von einem Bild zum anderen zu wechseln, bewegen Sie den Balken unter den Bildern, klicken Sie auf die Pfeiltasten rechts und links des Balkens oder klicken Sie auf das Bild, welches Sie sehen wollen. Zurück zur Seite "Multimedia" geht es über den Link "Zurück zu "Multimedia"".</p>
        <p align="center" class="style1"><br />ImageFlow Album created with<a href="http://jalbum.net" title="Album generated by JAlbum 7.4" target="_blank">JAlbum</a> by <a href="http://jalbum.macosxsupport.com" target="_blank">DrMikey<br />
      </a>MooFlow Javascript by <a href="http://www.outcut.de/MooFlow/">www.outcut.de</a><br />
      ReMooz lightbox by <a href="http://digitarald.de/project/remooz/" target="_blank">Harald Kirschner</a></p>
      <input type="hidden" name="cmd" value="_s-xclick"/>
    <input type="image" src="https://www.paypal.com/en_US/i/btn/x-click-but11.gif" name="submit" alt="PayPal - The safer, easier way to pay online!"/>
    <img alt="" border="0" src="https://www.paypal.com/en_US/i/scr/pixel.gif" width="1" height="1"/>
    <input type="hidden" name="encrypted" value="-----BEGIN PKCS7-----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-----END PKCS7-----
    ">
    </form>
      </div>
    	
    	</em></p>
    	
    </div> 
    <script type="text/javascript"><!--//--><![CDATA[//><!--
    _jaSkin = "ImageFlow 2";
    _jaStyle = "style.css";
    _jaVersion = "8.0";
    _jaPageType = "index";
    if (location.href.indexOf("http://") == 0 || location.href.indexOf("https://") == 0) {
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src = "http://jalbum.net/widgets/load.js";
    document.getElementsByTagName("body")[0].appendChild(script);
    }
    //--><!]]></script>
    
    </body>
    </html>
    
    Nun zeigt diese Liebenswerte Seite aber nicht den Favicon an... habe schon überlegt ob das mit damit was zu tun hat, dass ganz oben bei <!Doctype was von XHTML steht... habe daraufhin nach xhtml favicon gesucht und dann das gefundene ergebnis auf meine favicon datei angepasst.
    dabei ist die folgende zeile herausgekommen:
    Code:
    <link rel="icon" 
          type="image/x-icon" 
          href="/images/icon.ico" />
    ich weiß nicht ob der "/" vor dem Verzeichnis "images" richtig ist, es war auch im Beispiel so, ohne tut sich allerdings auch nichts.
    hat mir hier jemand einen tipp?
    viele grüße,
    grüße,
    kimi
     
  15. #13 slackfan, 08.09.2008
    slackfan

    slackfan König

    Dabei seit:
    18.04.2006
    Beiträge:
    809
    Zustimmungen:
    0
    Ort:
    Bonn
    Hallo,

    sollte es nicht reichen, wenn das Favicon im selben Verzeichnis wie die Datei liegt? Die Kombination
    Code:
    <link rel="shortcut icon" type="image/x-icon" href="favicon.ico"/>
    <link rel="icon" type="image/ico" href="favicon.ico"/>
    müsste eigentlich funktionieren.
    Mann kann auch ein PNG verwenden, wenn man am Alpha-Kanal Interesse hat. Ob mng's für ein animiertes Favicon funktionieren, wäre glatt mal interessant in Erfahrung zu bringen ;-)

    Außerdem habe ich noch eine klitzekleine Anmerkung, in der Hoffnung, dass sich die Welt ein bisschen verbessert :-): Laut CSS-Recommendation muss nach dem Doppelpunkt ein Leerzeichen folgen! Ich finde es immer wieder zum Brüllen, wenn Leute auf Webstandards pochen, aber bei so etwas Banalem versagen. (Ist nicht auf dich bezogen!)

    cu
     
Thema:

html frage

Die Seite wird geladen...

html frage - Ähnliche Themen

  1. Wohin mit Fragen zu HTML und Webdesign?

    Wohin mit Fragen zu HTML und Webdesign?: Hallo Gerade ist mir wieder ein Irrläufer-Thread im Forum Perl-PHP-... aufgefallen. Doch bevor ich anfange zu nörgeln (falsches Forum...)...
  2. Onlineumfrage programmieren (mehrseitige HTML Formular an PHP übergeben)

    Onlineumfrage programmieren (mehrseitige HTML Formular an PHP übergeben): Hallo zusammen, da ich normalerweise nicht in HTML / PHP programmiere, fehlt mir noch ein wenig die Idee zu folgendem Problem: Für meine...
  3. php/html: Zusammenfassung am Ende einer Umfrage

    php/html: Zusammenfassung am Ende einer Umfrage: Hallo, ich habe mal wieder eine Frage zu php/html: ich verwalte eine Umfrage, bei der ueber mehrere Seiten/php-Dateien hinweg Formulare...
  4. html seite runterladen und die Inhalte als .txt-Date speichern

    html seite runterladen und die Inhalte als .txt-Date speichern: Hallo! Ich bin noch neu auf dem Gebiet, von daher denke ich sind meine Fragen für manche von euch recht simpel. Mit den Standardbefehlen habe ich...
  5. HTML5 jetzt offizieller Standard

    HTML5 jetzt offizieller Standard: Die HTML5-Arbeitsgruppe beim W3C hat HTML5 jetzt zur »Empfehlung« erhoben, womit die neue Generation der Auszeichnungssprache nun offiziell...