|
|||
Absoluter Neuling sucht Hilfe!
Hallo Foris!
Ich habe unlängst die Aufgabe übernommen, für einen Verein eine Joomla-Seite zu gestalten: Ja zum Leben Zentralschweiz. Schön brav habe ich das Template der Vorlage auszutauschen begonnen (sieht im Explorer netterweise noch leicht verzerrt aus, aber das kennen wir ja schon) - und kriege nun das Menu nicht vor den Fliesstext! Auf die Gefahr, dass ich jetzt hier alle nerve mit so einer banalen Frage: Wer kann mir da helfen? Liebe Grüsse aus der Schweiz Adlerherz so sieht die Vorlage aus: body { margin: 0; padding: 0; border: 0; text-align: center; color:#660099; background-color: #9966CC; font-family: Souvenir, Humanist, Verdana, Arial, sans-serif; font-size: 100.01%; background-image: url(http://www.popstar.ch/joomla/images/M_images/back.gif); background-repeat: repeat-y; background-position: 50% 0px; } #box { width: 786px; margin-right: auto; margin-left: auto; text-align: left; margin: 0px 0px 0px 0px; padding: 0px; margin-top: 0px; position: relative; } a:link { color:#660066; text-decoration:none; } a:visited{ color:#02486C; text-decoration:none; } a:hover{ border-bottom: 0px solide #ffffff; } #title h1 { color: #FFFFFF; font-family: Geneva, Arial, Helvetica, sans-serif; font-size: 24px; text-align: right; font-style: oblique; font-variant: normal; margin: 0px 0px 0px 0px; padding: 0px; } #header { background-image: url(http://www.popstar.ch/joomla/images/...s/header.jpg); background-repeat: no-repeat; width: 786px; height: 300px; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } #top-nav{ width:0px; margin-left:0px; background-color : #02486C; height : 0px; font-size: 80%; border-top : 0px solid #FFFFFF; padding: 0px; margin-top: 0px; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: #FFFFFF; } #left-menu { width:180px; margin:0px 0px 0px 0px; border: 2px none #FFFFFF; padding: 0px; } #main { font-family:Souvenir, Humanist, Verdana, Arial, sans-serif; font-size: 12px; line-height: 11px; margin: 0px 0px 0px 0px; padding-left: 250px; border: thin none #FF0000; float: left; width: 520px; } #main p { padding-left: 15px; padding-right: 15px; } #main h1 { text-transform:uppercase; margin:10px 40px 0px 20px; color:#FFFF99; text-align:left; font-size: 120%; } a.mainlevel:link, a.mainlevel:visited { width: 155px; display: block; color: #660066; border-bottom: solid 1px #D3ADB4; font-size: 12px; font-weight: bold; text-decoration:none; text-align: left; text-indent: 14px; padding-top: 5px; padding-bottom: 5px; margin: 0px; } a.mainlevel:hover { width: 155; display: block; color: #FFFFCC; background: #993366; border-bottom: solid 1px #D3ADB4; font-size: 12px; font-weight: bold; text-decoration:none; text-align: left; text-indent: 14px; padding-top: 5px; padding-bottom: 5px; } table.moduletable { margin: 0px 0px 0px 0px; width: 95%; border-left: solid 0px #000000; border-right: solid 0px #000000; border-top: solid 0px #000000; border-bottom: solid 0px #000000; } table.moduletable th { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 0px; font-weight: bold; text-align: left; width: 100%; background: none; text-indent: 0px; height: 20px; line-height: 20px; } table.moduletable td { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; font-weight: normal; } .contentheading{ font-size:14px; color: #9900CC; background: url(../images/nexto.gif) center left no-repeat; padding: 0px 15px; padding-top: 0px } .sideheader { background-color: #02486C; color: #FFFFFF; font-size:15px; margin-top:10px; padding-top: 3px; padding-bottom: 3px; } #more-info { font-size: 0.75em; line-height: 130%; } #footer { margin-left: 11px; padding: 0px; margin-top: 60px; margin-right: 0px; margin-bottom: 0px; text-align: center; color: #02486C; } #footer a:link { color: #02486C; text-decoration:none; } #footer a:visited { color: #02486C; text-decoration:underline; } #footer a:hover { border-bottom: 1px solid #02486C; } .button { color: #0099CC; font-family: Arial, Verdana, Helvetica, sans-serif; margin-top: 4px; font-weight: normal; text-align: center; font-size: 12px; background: #EFEFEF; border: 1px solid #000066; height: 20px; } .ontab { background-color: #323A15; border-left: outset 1px #DCF2FA; border-right: outset 1px #808080; border-top: outset 1px #DCF2FA; border-bottom: solid 1px #d5d5d5; text-align: center; font-weight: bold; color: #FFFFFF; } .offtab { background-color : #e5e5e5; border-left: outset 1px #E0E0E0; border-right: outset 1px #E0E0E0; border-top: outset 1px #E0E0E0; border-bottom: solid 1px #d5d5d5; text-align: center; cursor: hand; font-weight: normal; } .createdate { padding-left:1px; color : #003366; text-align : left; font-size : 11px; } .modifydate { font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 10px; color: #333333; text-decoration: none; font-weight: normal; } a.readon:link, a.readon:visited { color: #003366; text-decoration: none; font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 11px; } a.readon:hover { color: #003399; text-decoration: none; font-weight: normal; font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 11px; } .sectiontableheader { background-color : #6699ff; background-repeat: repeat; padding: 2px; color : #0099CC; font-weight : bold; padding: 2px; } .sectiontableentry1, { background-color : #99ccff; } .sectiontableentry2 { background-color : #F3F3F3; } a.blogsection:link, a.blogsection:visited { color: #003366; text-decoration: underline; font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 10px; } a.blogsection:hover { color: #003366; text-decoration: underline; font-size: 10px; } .poll { font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 11px; font-weight: bold; color: #0099CC; line-height: 14px } .pollstableborder { border: 0px solid #FFFFFF; } a.weblinks:link, a.weblinks:visited { color: #003366; text-decoration: underline; font-weight: normal; font-family: Arial, Verdana, Helvetica, sans-serif; } a.weblinks:hover { color: #3366cc; text-decoration: none; } .newsfeedheading { font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 11px; font-weight: bold; color: #003366; } .newsfeeddate { font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 10px; color: #003366; font-weight: normal; } .fase4rdf { font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 11px; color: #003366; font-weight: normal; } a.fase4rdf:link { font-size: 11px; font-weight: bold; color: #003366; } a.fase4rdf:hover { font-size: 11px; font-weight: bold; color: #FFCC66; } table.searchintro { background-color: #FFFFFF; border: 1px solid #8D9ABC; } table.contact { background-color: #FFFFFF; } table.contact td.icons { background-color: #003366; } table.contact td.details { background-color: #ccccff; font-size: 11px; font-family: Arial, Verdana, Helvetica, sans-serif; } |
Sponsored Links |
|
|||
Super - jetzt ist es umgekehrt!
Liebe Stefanie*
Danke für die prompte Anwort! Jetzt ist es genau umgekehrt! Der Inhalt ist zwar rechts aber unten. Der HTML-Code gehört zwar nicht ins CSS-Forum, aber ich poste in doch noch hier - vielleicht ist es ein Detail, das ich nicht kapiere: [ 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> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" /> <title><?php echo $mosConfig_sitename; ?></title> <link href="<?php echo $mosConfig_live_site;?>/templates/behar/css/template_css.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="box"><!-- Begin Container Box --> <div id="title"> </div><!--site title at the top --> <!-- Header image --> <div id="header"></div> <div id="top-nav"><!-- begin to navigation --> </div><!-- End top navigation --> <!-- Begin left menu --> <div id="left-menu"> <?php mosLoadModules ( "left" ); ?> </div><!--end left menu --> <div id="main"><!-- Begin Main Content --> <?php mosLoadModules ( "top" ); ?> <?php include_once("mainbody.php"); ?> <div id="footer"> <?php mosLoadComponent( "banners" ); ?> </div> </div> <!-- end main content --> </div><!--end box div--> </body> </html> [ /code ] Wäre superlieb, wenn du da auch einen Ausweg wüsstest! Liebe Grüsse Adlerherz |
Sponsored Links |
|
|||
Hei Stefanie*
Hier zwei Screenshots: screenshot1.jpg screenshot2.jpg ...und nochmals mein posting: 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> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" /> <title><?php echo $mosConfig_sitename; ?></title> <link href="<?php echo $mosConfig_live_site;?>/templates/behar/css/template_css.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="box"><!-- Begin Container Box --> <div id="title"> </div><!--site title at the top --> <!-- Header image --> <div id="header"></div> <div id="top-nav"><!-- begin to navigation --> </div><!-- End top navigation --> <!-- Begin left menu --> <div id="left-menu"> <?php mosLoadModules ( "left" ); ?> </div><!--end left menu --> <div id="main"><!-- Begin Main Content --> <?php mosLoadModules ( "top" ); ?> <?php include_once("mainbody.php"); ?> <div id="footer"> <?php mosLoadComponent( "banners" ); ?> </div> </div> <!-- end main content --> </div><!--end box div--> </body> </html> Liebe Grüsse Adlerherz |
|
|||
nimm den FF (oder Opera) als Grundlage für die Entwicklungsphase. Später erfolgt die Anpassung an die Bugs des IE. Andersrum ist die Arbeit ziemlich sinnlos, weil Du quasi Fehler einbauen musst, um es korrekt aussehen zu lassen.
Im FAQ-Thread findest Du Beispiele zu 3-Spalten-Layouts. Vielleicht kommst Du auf dieser Grundlage besser zruecht. |
|
|||
aaaa!
Jetzt sieht es in FF schon mal nicht übel aus... Danke dir sehr!
Nur - was mache ich jetzt mit der hahnebüchenen IE-Version? Sind ja doch noch nicht alle so clever, dass sie FF benutzen... |
Sponsored Links |
|
|||
um Seiten mit bestimmten Eigenschaften auch im IE korrekt darzustellen, gibt es diverse workarounds und hacks und vor allem: Conditional Comments. Damit bekommt der IE Teile des CSS erneut, aber so wie er es braucht. Innerhlab des IE-CSS kann man mit den Hacks auch zwischen dem IE7 und älteren Versionen unterscheiden. Andere Browser erhalten nur das "normale" CSS.
|
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Neuling benötig Hilfe bei Footer Grafik | NoBobyLoveMe | CSS | 7 | 21.12.2009 18:53 |
absoluter css neuling braucht hilfe wegen bullets | ben2308 | CSS | 10 | 02.08.2009 13:45 |
Anfänger sucht Hilfe und Erfahrung bei Dropdown Menü | Mathao | CSS | 3 | 06.11.2007 03:20 |
Neuling braucht Hilfe beim Layout | chris-g1 | CSS | 7 | 23.11.2006 22:39 |
Noob sucht Hilfe | Keksli | Offtopic | 3 | 04.08.2006 10:42 |