Ankündigung

Einklappen
Keine Ankündigung bisher.

Problem mit Textausrichtung

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Gast-Avatar
    Ein Gast erstellte das Thema Problem mit Textausrichtung.

    Problem mit Textausrichtung

    Hallo zusammen ich bin gerade dabei mir ein html layout ohne tabellen nur mit hilfe von css zu erstellen.
    Leider habe ich ejtzt ein kleines Problem. Das layout habe ich soweit jetzt fertig. Nur ich habe ein problem mit der Textausrichtung.
    Ich habe ein zweispaltiges layout welches mit 2 floatenden div layern realisiert ist. Der Text wird in dem div-layer auch richtig dargestellt, aber nur wenn eine zeile innerhalb des inhaltes dabei ist die über die breite des layers rausgeht und dadurch umgebrochen wird. Dann wird der text auch richtig linksbündig ausgegeben.
    Habe ich allerdings nur eine zeile text im inhalt der die zeile nicht komplett ausfüllt so wird mir der text rechtsbündig ausgegeben, was ich nirgends angegeben habe.
    Ich habe auch schon alle möglichen varianten probiert text-align:left mit einzubauen. jedoch funktioniert das auch nicht, selbst wenn es direkt in einem

    tag angegeben ist.
    Hatte jemand vielleicht schon einmal ein ähnliches Problem?
    Zur Lösung stelle ich auch gerne css code und html code zur verfügung.
    Danke schon mal im voraus.

  • Gast-Avatar
    Ein Gast antwortete

    Ja sorry ich hab eben erst gestern damit angefangen alles mit css zu coden. Ichg laube das konnte keiner auf anhieb perfekt. Fehler sind da um sie zu machen und daraus zu lernen Und da bin ich ja gerade dabei.

    Einen Kommentar schreiben:


  • Gast-Avatar
    Ein Gast antwortete
    wo ist eigentlich dein Dokumenttyp? Ist zwar ganz toll wenn du alles "versuchst" in divs zu schreiben, aber der restliche Code einfach erbärmlich ist! Warum nicht gleich alles richtig machen? Mach xhtml draus, angefangen hast du´s ja schon beim meta und bei link Attribut, aber beim Rest...

    Einen Kommentar schreiben:


  • Gast-Avatar
    Ein Gast antwortete
    Moin

    Ändere mal in Deinem CSS das floating für #content von right auf left, dann klappt es.

    BTW logisches markup ist aber was anderes als diese tag-soup

    Gruß kpoint

    Einen Kommentar schreiben:


  • imported_Ben
    antwortet
    ich sehs jetzt grad .. aber ich muss pennen.
    ich teste das morgen .. hoffe, dass das noch reicht ..

    Einen Kommentar schreiben:


  • Gast-Avatar
    Ein Gast antwortete
    ok, weil dus bist
    also das ist der content, bei dem es funzt:
    Code:
    <p class="contentheader">Startseite</p>
    <p class="contenttext">Drei &lt;div&gt; -Container reichen f&uuml;r dieses Layout aus: Die Titelleiste, das Men&uuml; und der Inhalt.Drei &lt;div&gt; -Container reichen f&uuml;r dieses Layout aus: Die Titelleiste, das Men&uuml; und der Inhalt.Drei &lt;div&gt; -Container reichen f&uuml;r dieses Layout aus: Die Titelleiste, das Men&uuml; und der Inhalt.Drei &lt;div&gt; -Container reichen f&uuml;r dieses Layout aus: Die Titelleiste, das Men&uuml; und der Inhalt.Drei &lt;div&gt; -Container reichen f&uuml;r dieses Layout aus: Die Titelleiste, das Men&uuml; und der Inhalt.Drei &lt;div&gt; -Container reichen f&uuml;r dieses Layout aus: Die Titelleiste, das Men&uuml; und der Inhalt.</p>
    und hier funzt es nicht:
    Code:
    <p class="contentheader">Impressum</p>
    <p class="contenttext">Webmaster</p>
    <p class="contenttext">Frank Eisenhauer
    
      F&uuml;rther Str. 55
    
      64756 Mossautal
    
      
    
      Email  </p>

    Einen Kommentar schreiben:


  • imported_Ben
    antwortet
    äh .. *gg* .. ich wollt das grad testen .. aber ich bräuchte ja noch den teil, wo der fehler eigentlich auftritt .. also inhalt eben ..

    Einen Kommentar schreiben:


  • Gast-Avatar
    Ein Gast antwortete
    Oha da hat ja jemand augen wie ein lux Ja der schleißende Tag hat gefeht. Das hab ich jetzt mal behoben.
    Aber an der Ausrichtugn hat es wieder nur da was bewirkt wo der text länger als eine zeile ist
    Ich habe in dem stylesheet bei dem #content noch text-align:left; eingefügt.

    Einen Kommentar schreiben:


  • imported_Ben
    antwortet
    also .. nur mal so auf den code geschaut .. fehlt nicht das schließende </div> des containers mit der id "content" ??

    Einen Kommentar schreiben:


  • Gast-Avatar
    Ein Gast antwortete
    Code:
    /* Grundelemente */
    body{
    	font-family:Verdana, Arial, Helvetica, sans-serif;
    	padding:0px;
    	margin:0px;
    	background-color:#ffffff;
    	text-align:center;
    	}
    h1{
    	font-size:18px;
    	font-weight:bold;
    	}
    
    /* class Selektoren */
    .contentheader{
    	font-size:24px;
    	font-weight:bold;
    	}
    .contenttext{
    	font-size:12px;
    	}
    /* ID Selektoren */
    #box{ /*box um gesamten Inhalt */
    	width:770px;
    	margin: 25px;
    	}
    /*beginn header*/
    #header{
    	border:1px solid #000000;
    	padding: 0;
    	background-color: #eeeeee;
    	text-align:center;
    	}
    #logo{
     	padding: 0px 0px 0px 0px; 
    }
    #headersubtitle{
    	font-size:11px;
    	font-weight:bold;
    	color:#000000;
    	margin: 0px 0px 7px 0px;
    	}
    #headerbottom{
    	font-size:12px;
    	font-weight:bold;
    	color:#ffffff;
    	text-align:left;
    	background-color:#0000ff;
    	border-top:1px solid #000000;
    	padding: 1px 10px 1px 10px;
    	}
    /*ende header*/
    /*beginn navigation*/
    #navigation{
    	padding: 25px 0px 0px 0px;
    	margin: 0px 15px 0px 0px;
    	float:left;   
    	}                     
    .menucontainer{
    	width:120px;
    	border:1px solid #000000;
    	background-color:#0000ff;
    	margin: 0px 0px 15px 0px;
    	}
    .menutitle{
    	font-size:12px;
    	font-weight:bold;
    	color:#FFFFFF;
    	text-align:left;
    	margin:3px;
    	padding: 0px 0px 0px 5px;
    	}
    a.menu:active, a.menu:hover{ 
     	color:#efefef;
    	background-color:#737994;
    	}
    a.menu, a.menu:link, a.menu:visited {
     display:block;
     padding:3px 5px 3px 10px;
     border-top:1px solid #000;
     background-color:#efefef;
     text-align:left;
     font-weight:bold;
     font-size:10px;
     color:#000000;
     text-decoration:none;
     }
    
    /*ende navigation*/
    /*beginn content*/
    #content{
    	float:right;
    	padding: 20px 0px 30px 30px;
    	}
    #text{
    	text-align:left;
    	}
    
    /*ende content*/
    einmal css und hier noch der zugehörige html code:
    Code:
    <head>
    <title>Diplom 2004</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <link href="tools/style.css" rel="stylesheet" type="text/css" />
    </head>
    
    <body>
    <div id="box">
    
    <div id="header">
    	[img]tools/header.jpg[/img]
    	<div id="headersubtitle"><span>Studiengang Bank 2001 an der Berufsakademie Mosbach</span></div>
    	<div id="headerbottom">
    	<span>Startseite</span>
    	</div>
    </div>
    
    <div id="navigation">
    	<div class="menucontainer">
    	<p class="menutitle">Menu</p>
    	Startseite
    	Der Kurs
    	Bilder
    	Gästebuch
    	Impressum
    	</div>
    	<div class="menucontainer">
    	<p class="menutitle">Login</p>
    	Startseite
    	Der Kurs
    	</div>
    </div>
    <div id="content">
    <div id="text">
    <?php
    if(!isset($_GET['inc']) || $_GET['inc'] == "")
    {
    include("inc/home.inc.php");
    }
    else
    {
    include("inc/".$_GET['inc'].".inc.php");
    }
    ?> 
    </div> 
    
    </div>
    </body>
    </html>

    Einen Kommentar schreiben:


  • imported_Ben
    antwortet
    code?

    Einen Kommentar schreiben:

Lädt...
X