Gerhard: Hilfe bei Boxen floaten nicht

SELF-Forum

Hilfe bei Boxen floaten nicht

Gerhard (Versionen)
– Informationen zu den Bewertungsregeln

Guten Abend in die Runde, Benötige Hilfe bei folgendem Problem: Zwischen Header und Footer sollen im Inhaltsbereich zwei zwei Boxen nebeneinander erscheinen. Die linke (250px breit) enthält die Links, die rechte daneben den Inhaltstext (verwende Dreamweaver CC). Meine fehlerhafte Schöpfung:

  </div></header>
<!--Inhaltsbereich-->
<!--linke Seitenleiste-->
    <div id="seitenleiste">
      <article id="links"><a href="indext.html">Home</a>
	    <a href="../Über Uns">Über Uns</a>
        <a href="../Selbsthilfe">Selbsthilfe</a>
      <a href="../Literatur">Literatur</a></article>
  	</div>

<!--Inhaltsbox-->   
    <section id="Inhaltsbox">
   		<article>Der Landesverband hilft .....
        </article> 
   </section>

Das Floaten funktioniert so aber nicht. Wer kann helfen?

Danke schon im voraus!

Gerhard

Alternativ-Text

Beitrag melden
–
Informationen zu den Bewertungsregeln

akzeptierte Antworten

  1. Hilfe bei Boxen floaten nicht

    Gunnar Bittersmann Homepage des Autors (Versionen)
    – Informationen zu den Bewertungsregeln

    @@Gerhard

    Benötige Hilfe bei folgendem Problem: Zwischen Header und Footer sollen im Inhaltsbereich zwei zwei Boxen nebeneinander erscheinen. Die linke (250px breit) enthält die Links, die rechte daneben den Inhaltstext

    Das ist wahrhaftig ein Problem: Der Viewport (das Browserfenster) ist auf meinem Gerät 320px breit. Wie soll da neben eine 250px breite Box noch Inhaltstext passen? Das ist das Web.

    Das Floaten funktioniert so aber nicht. Wer kann helfen?

    Niemand, da du weder deine problematische Seite noch den CSS-Code gezeigt hast.

    LLAP 🖖

    --
    „Wir haben deinen numidischen Schreiber aufgegriffen, o Syndicus.“
    „Hat auf dem Forum herumgelungert …“
    (Wachen in Asterix 36: Der Papyrus des Cäsar)
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. Hilfe bei Boxen floaten nicht

      Gerhard
      – Informationen zu den Bewertungsregeln

      @@Gerhard

      Benötige Hilfe bei folgendem Problem: Zwischen Header und Footer sollen im Inhaltsbereich zwei zwei Boxen nebeneinander erscheinen. Die linke (250px breit) enthält die Links, die rechte daneben den Inhaltstext

      Das ist wahrhaftig ein Problem: Der Viewport (das Browserfenster) ist auf meinem Gerät 320px breit. Wie soll da neben eine 250px breite Box noch Inhaltstext passen? Das ist das Web.

      Das Floaten funktioniert so aber nicht. Wer kann helfen? Habe als Anfänger auf die layout.css nicht geachtet. Diese jetzt nachfolgend:Alternativ-Text

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. Hilfe bei Boxen floaten nicht

        Gunnar Bittersmann Homepage des Autors
        – Informationen zu den Bewertungsregeln

        @@Gerhard

        Habe als Anfänger auf die layout.css nicht geachtet. Diese jetzt nachfolgend:Alternativ-Text

        Dazu lässt sich nur sagen: box-shadow braucht in keinem Browser einen Präfix. Wenn du also die Zeilen mit -o-box-shadow, -moz-box-shadow und -webkit-box-shadow weglässt, passen 3 Codezeilen mehr in den Screenshot von deinem Stylesheet. Vielleicht sind ja dann die relevanten Codezeilen zu sehen.

        LLAP 🖖

        --
        „Wir haben deinen numidischen Schreiber aufgegriffen, o Syndicus.“
        „Hat auf dem Forum herumgelungert …“
        (Wachen in Asterix 36: Der Papyrus des Cäsar)
        Beitrag melden
        –
        Informationen zu den Bewertungsregeln

        1. Hilfe bei Boxen floaten nicht

          Gerhard (Versionen)
          – Informationen zu den Bewertungsregeln

          Danke für die Antworten. Nachfolgend noch die problematische index.html (leider sah ich keine Möglichkeit, sie als Datei hochzuladen). Noch zur Erläuterung meiner sicherlich dilletantischen Html-Schreibweise und meinem Box-Problemangesprochenen: Als Anfänger versuche ich parallel zum Video2Brain-Training: Websites mit Dreamweaver CC die Website zu erstellen. Dabei freue ich besonders über Deine Hilfe.

          <!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>LVAPK Landesverband Thüringen</title>
<style type="text/css">
#hauptcontainer {
	height: auto;
	width: 760px;
	margin-right: auto;
	margin-left: auto;
	}
#bildbox {
	height: 141px;
	width: 250px;
	float: left;
	background-color: #F8E3BB;
}
#logobox {
	height: 101px;
	width: 260px;
	float: left;
	background-color: #FDF1D8;
	margin-left: 30px;
	margin-right: -20px;
	margin-top: 40px;
	margin-bottom: -40px;
}
#sitetitle {
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	height: 100px;
	width: auto;
	margin-top: 0px;
	background-color: #FDF1D8;
	text-align: left;
	letter-spacing: 0px;
	top: 0px;
	padding-top: 25px;
	padding-bottom: 15px;
}
body,td,th {
	color: #823D1E;
}
.bg_home {
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

#wrapper {
	width: 100%;
	height: 100%;
}
.Schrift {
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #000000;
}
#Inhaltsbox {
	background-color: #FDF1D8;
	height: auto;
	width: auto;
	float: left;
}

#seitenleiste {
	background-color: #FDF1D8;
	height: 500px;
	width: 250px;
	padding-top: 20px;
}
</style>
<link href="file:///C|/Reserve LAPK/CSS/layout.css" rel="stylesheet" type="text/css">
</head>
<body class="bg_home">
<div class="clearfix" id="wrapper">

<!--Kopfbereich-->
<header>
  <div id="bildbox"><img src="file:///C|/Users/Gerhard/Documents/LAPK Thüringen/images/Bild.jpg" width="250" height="141" alt=""/></div>
    <div id="logobox"><img src="file:///C|/Users/Gerhard/Documents/LAPK Thüringen/images/LVAPK.png" width="201" height="55" alt="Logo"/></div>
    <div id="sitetitle">
      <h1>Landesverband Thüringen der Angehörigen psychisch Kranker e.V.</h1>
    </div></header>
    
<!--linke Seitenleiste-->
    <div id="seitenleiste">
      <article id="links"><a href="indext.html">Home</a> <a href="Über Uns/">Über Uns</a> <a href="Selbsthilfe/">Selbsthilfe</a> <a href="Literatur/">Literatur</a></article>
  </div>
    <article>Der Landesverband hilft ....</article>

<div>
  
  <!--Inhaltsbereich-->
  
  </div>

 
<!--Fußbereich-->
<footer>
<div id="Fußbox">Raum für den Inhalt von  id "Fußbox"</div>
  <!--unsortierte Liste mit Links-->
 
 
    <li>Landesverband Thüringen der Angehörigen psychisch Kranker e.V. </li>
    <nav>
    	<ul>
  <li class="bg_home">Geschäftsstelle</li>
  	      <li>Bahnhofstraße 1a</li>
  	      <li>07646 Stadtroda</li>
          <li>Telefon/Fax: +49 36428 12456</li>
  	    	<li>E-Mail: <a href="mailto:geschst@lvthueringen-apk.de">geschst@lvthueringen-apk.de</a></li>
            <li>Unsere Internet-Adresse: <a href="http://www.lvapk-thueringen.de">http://www.lvapk-thueringen.de</a></li>
       </ul>
</nav>
</footer>
</div></body>

</html>

          Dazu lässt sich nur sagen: box-shadow braucht in keinem Browser einen Präfix. Wenn du also die Zeilen mit -o-box-shadow, -moz-box-shadow und -webkit-box-shadow weglässt, passen 3 Codezeilen mehr in den Screenshot von deinem Stylesheet. Vielleicht sind ja dann die relevanten Codezeilen zu sehen.

          LLAP 🖖

          „Wir haben deinen numidischen Schreiber aufgegriffen, o Syndicus.“
          „Hat auf dem Forum herumgelungert …“
          (Wachen in Asterix 36: Der Papyrus des Cäsar)

          Beitrag melden
          –
          Informationen zu den Bewertungsregeln

          1. Hilfe bei Boxen floaten nicht

            Gerhard (Versionen)
            – Informationen zu den Bewertungsregeln

            Nachfolgend noch die neuen Codezeilen der Layout.css:

            body {
	font-size: 16px;
	margin: 0;
	padding: 0;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	-webkit-box-shadow: 0px 0 #823D1E;
	box-shadow: 0px 0 #823D1E;}
            Beitrag melden
            –
            Informationen zu den Bewertungsregeln

            1. Hilfe bei Boxen floaten nicht

              Matthias Apsel
              – Informationen zu den Bewertungsregeln

              Hallo Gerhard,

              body {
	-webkit-box-shadow: 0px 0 #823D1E;
	box-shadow: 0px 0 #823D1E;}

              box-shadow braucht, wie schon gesagt, keinen Präfix mehr. 0px ist dasselbe wie 0.

              Bis demnächst
              Matthias

              --
              Das Geheimnis des Könnens liegt im Wollen. (Giuseppe Mazzini)
              Beitrag melden
              –
              Informationen zu den Bewertungsregeln

          2. Hilfe bei Boxen floaten nicht

            Gunnar Bittersmann Homepage des Autors
            – Informationen zu den Bewertungsregeln

            @@Gerhard

            (leider sah ich keine Möglichkeit, sie als Datei hochzuladen).

            ?? Wenn du eine Webseite hast, hast du doch Webspace, wo du Dateien hochladen kannst? Ansonsten bieten sich auch Dienste wie Codepen oder Dabblet an. Auf Copy-and-Paste-Orgien hat niemand Lust.

            Bitte markiere Code im Posting als solchen (Button „</> Quelltext“ über dem Eingabefeld), ansonsten wird dein Posting unlesbar. (Ich hab das mal korrigiert.)

            Und bitte kein TOFU im Forum.

            LLAP 🖖

            --
            „Wir haben deinen numidischen Schreiber aufgegriffen, o Syndicus.“
            „Hat auf dem Forum herumgelungert …“
            (Wachen in Asterix 36: Der Papyrus des Cäsar)
            Beitrag melden
            –
            Informationen zu den Bewertungsregeln