mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Do 28.03.2024 09:31 Benutzername: Passwort: Auto-Login

Thema: Text geht über Rand hinaus vom 01.03.2008


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> Text geht über Rand hinaus
Autor Nachricht
klsa12
Threadersteller

Dabei seit: 14.11.2007
Ort: Dresden
Alter: 38
Geschlecht: Männlich
Verfasst Sa 01.03.2008 09:52
Titel

Text geht über Rand hinaus

Antworten mit Zitat Zum Seitenanfang

Ich habe folgendes Problem...

auf meiner Joomla (1.5) Seite habe ich ein vorgefertigtes Layout hochgeladen was ich nach meinen Wünschen anpassen will. Aber schon beim ersten Problem bin ich am verzweifeln. Der Text ist länger als der Contentbereich breit ist und geht über den Rand hinaus, bzw. dank dem overflow-code wird der Rest der drüber hinaus geht nicht mehr gezeigt.

Was ist im Code falsch das es den Text nicht richtig einpasst?

www.martin-boose.de/bichareh

Hier der Code...

Zitat:
/* ----- Main Layout Elements ----- */
body {
background: #ffffff;
text-align: center;
padding: 0;
margin: 0;
font-family: Arial, Verdana, sans-serif;
}
#container {
min-width: 760px;
max-width: 960px;
font-size: 12px;
margin: 0 auto;
text-align: left;
clear: both;
}
#header {
background-image: url('../images/bg-header.jpg');
background-color: #48b5eb;
height: 185px;
margin: 0 auto;
clear: both;
}
#headerinside {
min-width: 760px;
max-width: 960px;
margin: 0 auto;
height: 140px;
padding-top: 10px;
text-align: left;
clear: both;
}
#leftsidebar {
float: left;
width: 20%;
overflow: hidden;
}
#main {
float: left;
width: 60%;
overflow: hidden;
}
#rightsidebar {
float: left;
width: 20%;
overflow: hidden;
}
#footer {
clear: both;
text-align: center;
font-size: 10px;
padding-top: 10px;
}
a, a:visited {
color: #b20a0a;
}
a:hover {
color: #890707;
}
#searchForm {
padding-top: 10px;
}

/* ----- Top Menu ----- */
#topmenu {
margin: 0 auto;
height: 39px;
text-align: center;
padding-top: 7px;
clear: both;
}
#topmenu .moduletable {
border: 0;
padding: 0;
margin: 0 auto;
}
#topmenu ul {
margin: 0;
padding: 0;
list-style: none;
}
#topmenu li {
display: inline;
margin: 0;
padding: 0;
border-right: 1px solid #444444;
}
#topmenu a, #topmenu a:visited {
font-weight:bold;
padding-right: 10px;
padding-left: 10px;
color: #f7f79b;
text-decoration: none;
}
#topmenu a:hover {
text-decoration: underline;
}

/* ----- Left Sidebar Elements ----- */
#leftsidebar ul {
margin: 0px;
padding-left: 20px;
padding-top: 5px;
}
#leftsidebar ul li {
margin: 0px;
padding: 0px;
list-style-type: square;
}
#leftsidebar ul li a {
text-decoration: none;
}
#leftsidebar ul li a:hover {
text-decoration: underline;
}
#leftsidebar h3 {
margin: 0px;
padding: 0px;
padding-top: 10px;
border-bottom: 1px solid #777777;
font-size: 16px;
}


/* ----- Right Sidebar Elements ----- */
#rightsidebar .moduletable, #rightsidebar .moduletable_text {
border: 1px solid #000000;
margin-top: 10px;
padding: 5px;
}
#rightsidebar .moduletable h3, #rightsidebar .moduletable_text h3 {
margin: -5px;
margin-bottom: 5px;
padding: 2px;
padding-left: 18px;
color: #ffffff;
background-color: #000000;
border-bottom: 1px solid #777777;
font-size: 16px;
background-image: url('../images/moddeco.png');
background-repeat: no-repeat
}
#rightsidebar p {
margin-top: 0px;
margin-bottom: 10px;
}


/* Additional markups */
.pagenavcounter, .pagenav {
font-size: 10px;
}
.contenttoc {
padding: 5px;
}

div.componentheading { /* Component heading */
font-size: 16px;
border-bottom: 1px solid #777777;
font-weight: bold;
margin-top: 10px;
border-bottom: 1px solid #cccccc;
}
td.contentheading { /* Post titles/headings */
font-size: 16px;
font-weight: bold;
clear: both;
padding-top: 10px;
}
table.contentpaneopen { /* Table wrapping posts */
margin: 0;
padding: 0;
}
#form-login-remember { /* Small 'remember me?' text in login form */
font-size: 12px;
padding-bottom: 5px;
}
#form-login {
text-align: center;
}
#form-login ul, #form-login-username, #form-login-password, #form-login-remember {
text-align: left;
}
fieldset.input {
border: 0;
}
#form-login #form-login-remember {
text-align: center;
}
form {
margin:0;
}
td.sectiontableentry1 {} /* Alternating rows for polls */
td.sectiontableentry2 { /* Alternating rows for polls */
background-color: #f9f9f9;
}
.button {
background-color: #ddecf3;
font-size: 12px;
font-family: verdana, arial;
border-top: 1px solid #e7f7ff;
border-left: 1px solid #cde4ef;
border-bottom: 1px solid #000000;
border-right: 1px solid #245167;
}
.buttonheading img {
border: none;
margin: 0;
padding: 0;
}
span.small { /* Small text underneath post title, i.e. 'Written by...' */
font-size: 10px;
margin: 0;
padding: 0;
}
td.createdate { /* Small date under post titles */
font-size: 10px;
text-align: left;
color: #999999;
}
td.modifydate { /* The 'Last Updated' date under posts/modules. */
font-size: 10px;
text-align: right;
font-style: italic;
}
a.readon { /* The 'Read More...' link under posts/modules. */
font-size: 10px;
float: right;
text-align: right;
}
td.article_column {
padding-right: 10px;
}
table.pollstableborder {
text-align: left;
width: 100%;
}
p {
margin: 0;
padding: 0;
}
span.breadcrumbs {
font-size: 10px;
color: #666666;
}
.crumbbg {
background-color: #fff0f0;
}
div.bannerheader {
font-size: 10px;
}
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
therapiekind

Dabei seit: 14.03.2006
Ort: In deinem Kopf
Alter: -
Geschlecht: -
Verfasst Sa 01.03.2008 10:47
Titel

Antworten mit Zitat Zum Seitenanfang

Im zweiten Artikel "Germanys Next Topmodel ist...", im dritten Absatz. Schau mal, was nach
Zitat:
"In der glorreichen Pro7-Show "The Next Uri Geller" wurden 8 Wochen lang aus einem Haufen verrückter"

kommt. Dort folgt ein Möchtegern-Link, bei dem einige Zeichen in HTML-Entitäten umgewandelt wurden. Z.B. auch die spitzen Klammern der Element-Tags. Und dann ist das natürlich kein HTML mehr, sondern nur noch stinknormaler Text.

Und das href-Attribut in diesen Link-Elementen ist bei einigen ganz schön lang und ohne Leerzeichen natürlich. Das kann natürlich nicht umgebrochen werden und endet dann in 'ner ewig langen Zeilen, die alles auseinander drückt.

Langer Rede, kurzer Sinn: Mit was auch immer du deinen Text eingibst, das funktioniert nicht so richtig. Oder du gibst die Links als HTML ein und das Teil wandelt dann unter anderem die spitzen Klammern um.

Ok? *Thumbs up!*
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
heiko_rs

Dabei seit: 06.02.2008
Ort: Berlin
Alter: -
Geschlecht: Männlich
Verfasst Sa 01.03.2008 10:47
Titel

Antworten mit Zitat Zum Seitenanfang

Du hast mehrfach < maskiert, wo es nicht maskiert werden sollte *zwinker* Dadurch werden einige Links keine Links, sondern ihr HTML-Code inkl. ellenlanger URL in den Text geschrieben, wodurch die komplette Tabelle ausgedehnt wird.

Übrigens haben Tabellen in Deinem Markup absolut nix verloren, da würde ich mal ordentlich aufräumen. Und aus

Code:
<div class="componentheading">Willkommen auf der Startseite</div>

wird
Code:
<h2>Willkommen auf der Startseite</h2>

(das Logo würde ich in h1 stellen.) Ähnliches gilt hier:

Code:
<td class="contentheading" width="100%">test</td>

Und schau Dir Dein Alphatransparenz-png-Logo mal im IE 6 an, und siehe dann entweder http://www.satzansatz.de/cssd/tmp/alphatransparency.html oder probiere (zumindest für IE < 7) ein gif mit Indextransparenz und dem dunkleren Rot-Ton als Hintergrund - das dürfte bei den sehr ähnlichen Rot-Tönen kaum auffallen. Dennoch empfehle ich erstere Variante. Das gif bekommt dann der IE 5.0 *zwinker*
  View user's profile Private Nachricht senden
therapiekind

Dabei seit: 14.03.2006
Ort: In deinem Kopf
Alter: -
Geschlecht: -
Verfasst Sa 01.03.2008 10:49
Titel

Antworten mit Zitat Zum Seitenanfang

Ha! *bäh*
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
heiko_rs

Dabei seit: 06.02.2008
Ort: Berlin
Alter: -
Geschlecht: Männlich
Verfasst Sa 01.03.2008 10:53
Titel

Antworten mit Zitat Zum Seitenanfang

*ha ha* Zusatz-Tipps brauchen halt so 1 bis 2 Minuten *zwinker*
  View user's profile Private Nachricht senden
klsa12
Threadersteller

Dabei seit: 14.11.2007
Ort: Dresden
Alter: 38
Geschlecht: Männlich
Verfasst Sa 01.03.2008 11:54
Titel

Antworten mit Zitat Zum Seitenanfang

uhh ihr seid geil, es hat funktioniert!!!!

Danke Lächel
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
therapiekind

Dabei seit: 14.03.2006
Ort: In deinem Kopf
Alter: -
Geschlecht: -
Verfasst Sa 01.03.2008 12:55
Titel

Antworten mit Zitat Zum Seitenanfang

heiko_rs hat geschrieben:
*ha ha* Zusatz-Tipps brauchen halt so 1 bis 2 Minuten *zwinker*


Touché.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
 
Ähnliche Themen Text geht über die Div hinaus
Text läuft im IE 7 über footer hinaus
[CSS] Bild ragt über <div> hinaus
Border springt über's Ziel hinaus
CSS -Inhalt geht über mein DIV hinaus... warum?
Rand im IE
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.