mediengestalter.info
Datenschutzerklärung
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter
Aktuelles Datum und Uhrzeit: Fr 19.04.2024 07:56 Benutzername: Passwort: Auto-Login

Thema: CSS Layout geht beim verkleinern des Browsers kaputt! vom 22.04.2009


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> CSS Layout geht beim verkleinern des Browsers kaputt!
Autor Nachricht
ural
Threadersteller

Dabei seit: 06.01.2009
Ort: -
Alter: 35
Geschlecht: Männlich
Verfasst Mi 22.04.2009 10:19
Titel

CSS Layout geht beim verkleinern des Browsers kaputt!

 Antworten mit Zitat Zum Seitenanfang
Hallo,

wie schon gesagt geht mein CSS Layout kaputt, wenn ich den Browser verkleiner.
Soll eine Barrierefreie Seite werden. Ich bekomm das irgendwie nicht weg.

Könnt Ihr mir dabei helfen?
  View user's profile Private Nachricht senden
DerM

Dabei seit: 18.01.2009
Ort: -
Alter: 42
Geschlecht: Männlich
Verfasst Mi 22.04.2009 10:28
Titel

Antworten mit Zitat Zum Seitenanfang
Mein Glaskugel ist in Urlaub.. Könntest Du uns bitte ein wenig mehr Informationen geben ? Screenshot, link ??
  View user's profile Private Nachricht senden
Anzeige
Anzeige
ural
Threadersteller

Dabei seit: 06.01.2009
Ort: -
Alter: 35
Geschlecht: Männlich
Verfasst Mi 22.04.2009 10:48
Titel

Antworten mit Zitat Zum Seitenanfang
Leider kann ich nichts zeigen.
Aber ich versuch dass ganze mal etwas ausfühlrich zu erklären. Immerhin hast dein Glaskugel nicht bei dir.

Beispiel:

Tabbed Navigation in css

Button1 Button2 Button3 Button4 Button5 Button6

Über die Gesamte Breite verteilt.

Nun wenn ich hin gehe und Browserfenster verkleiner, wird die Struktur der BUttons geändert.

|Button1Button2Butt|
|on3|Button4Button|
|5Button6 |

Was ich möchte?

Die Abstände zwishen den Buttons können ruhig verschwinden beim verkleiner des Browsers.
Aber wenn alle Buttons dicht aneinander liegen, soll der Browser ein Scrollbalken hinzufügen.

Theretisch kann man mit minwidth arbeiten, abgesehen von den IE Problems.

Kann mir jetzt vielleicht jemand was genaueres sagen?
Oder Muss ich jetzt ein Beispiel erstellen um es euch zu zeigen
  View user's profile Private Nachricht senden
Kash

Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht: Männlich
Verfasst Mi 22.04.2009 10:53
Titel

Antworten mit Zitat Zum Seitenanfang
zeig dein CSS und HTML MarkUp
  View user's profile Private Nachricht senden
ural
Threadersteller

Dabei seit: 06.01.2009
Ort: -
Alter: 35
Geschlecht: Männlich
Verfasst Mi 22.04.2009 11:03
Titel

Antworten mit Zitat Zum Seitenanfang
Code:

<div class="formular">
   <form name="expressform" ENCTYPE="multipart/form-data" method="post" action="admin_pagemanagement.php">
   <input type="hidden" name="action" value="addsave">
   <input type="hidden" name="sid" value="{$sid}">

   <ul style="height:25px;background-color:#999999;color:white;">
   <li class="float_l"><strong>Eigenschaften:</strong></li>
   <li class="float_r"><a onmouseover="writetxt('Hier k&ouml;nnen Sie die Eigenschaften der neuen Seite festlegen. der Seitenname darf dabei nicht aus Gro&szlig;buchstaben, Sonderzeichen oder Leerzeichen bestehen.')" onmouseout=writetxt(0) href="#"><strong>?</strong></a></li>
   </ul>

   <div class="clear space_ver_10"></div>
   <ul>
   <li class="float_l">Seitenname:</li>
   <li class="float_r"> <input style="WIDTH: 200px" name="sitename" value="{$sitename}" size="5"></li>
   </ul>
   
   <div class="clear space_ver_10"></div>
   <ul>
   <li class="float_l">Zur Gruppe:</li>
   <li class="float_r">{$add_category}</li>
   </ul>
   
   <div class="clear space_ver_10"></div>
   <ul>
   <li class="float_l">&Uuml;berschrift:</li>
   <li class="float_r"><input style="WIDTH: 200px" name="my[title]" size="5"></li>
   </ul>
   
   <div class="clear space_ver_10"></div>
   <ul>
   <li class="float_l">aktiviert:</li>
   <li class="float_r">
        <select class="text" name="my[active]" size="1">
            <option value="1">ja</option>
            <option value="0" selected>nein</option>
           </select>
   </li>
   </ul>
   
   <div class="clear space_ver_10"></div>
   <ul>
   <li class="float_l">Quelltextbearbeitung:</li>
   <li class="float_r"><a onmouseover="writetxt('Hier k�nnen Sie den Quelltext der neuen Seite festlegen.')" onmouseout=writetxt(0) href="#"><img border="0" src="theme/admin_images/faq.gif" width="15" height="12"></a></li>
   </ul>
   
   <div class="clear space_ver_10"></div>
   <ul>
   <li class="float_l" style="height:250px;"><textarea style="WIDTH: 800px; HEIGHT: 250px" name="contentpage" rows="1" cols="20"></textarea></li>
   </ul>
   
   <div class="clear space_ver_10"></div>
   <ul>
   <li class="float_l">Metadaten:</li>
   <li class="float_r"><a onmouseover="writetxt('Hier k�nnen Sie die Metadaten (Schl�sselw�rter, Kurzbeschreibung der Metatags) sowie extra Metatags der Seite bearbeiten.')" onmouseout=writetxt(0) href="#"><img border="0" src="theme/admin_images/faq.gif" width="15" height="12"></a></li>
   </ul>
   
   <div class="clear space_ver_10"></div>
   <ul>
   <li class="float_l">
   Schl&uuml;sselw&ouml;rter:</li>
   <li class="float_r"><input style="WIDTH: 380px" name="my[meta_keywords]" size="10"> (max. 255 Zeichen)</li>
   </ul>
   
   <div class="clear space_ver_10"></div>
   <ul>
   <li class="float_l">     Kurzbeschreibung:</li>
   <li class="float_r"><input style="WIDTH: 380px" name="my[meta_description]" size="10"> (max. 255 Zeichen)</li>
   </ul>
   
   <div class="clear space_ver_10"></div>
   <ul>
   <li class="float_l">      Zus&auml;tzliche Metatags:<</li>
   <li class="float_r"><textarea style="WIDTH: 100%; HEIGHT: 75px" name="edit_metatags" rows="1" cols="20"></textarea></li>
   </ul>
   
   <div class="clear space_ver_10"></div>
   <ul>
   <li class="float_l"><input type="submit" value="Hinzuf&uuml;gen" name="submit"></li>
   <li class="float_r"> <input type="reset" value="l&ouml;schen" name="submit"></li>
   </ul>
   </form>   
</div>


Code:

.formular               {font-size:11px;color:black;padding:0;margin:0;}
.formular ul             {list-style-type:none;padding-left:20px;padding-right:20px;margin:0;}
.formular ul li          {display:inline;padding:0;margin:0;height:25px;line-height:25px;}
.formular_li_blue         {background:url(../media/list_row_blue.gif) repeat-x;}


Zuletzt bearbeitet von ural am Mi 22.04.2009 11:04, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
 
Ähnliche Themen Grafik im Adressfenster des Browsers!
Adressleiste des Browsers auslesen mit PHP
Problem mit HTML-Tabelle bei Verschieben des Browsers!
Wie bekomme ich mein Logo in das Eingabefeld des Browsers...
Automatische Spracherkennung des Browsers ohne JS möglich?
Apple Safari | Fehlermeldung beim Start des Browsers
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.

Mediengestalter.info ist ein Projekt von Webformatik :: Forensoftware: phpBB