Zum Inhalt springen
View in the app

A better way to browse. Learn more.

Fachinformatiker.de

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

ausgelagerte CSS

Empfohlene Antworten

Veröffentlicht

folgendes banales Prob :)

eine ausgelagerte CSS angelegt.

In der will ich zusätzlich einen extra div ansprechen.

Eigentlich keine große Sache, weil im Quelltext jeder div seine eigene ID hat.

Nunja, aber es lüppt halt ned.

Auszug aus dem Quelltext:


<div id="Layer1" style="position:absolute; width:210px; height:96px; z-index:1;"><img src="logo.gif" alt="CSH Logo" width="210" height="96"></div>

<div id="Layer2" style="position:absolute; width:578px; height:96px; z-index:2; right: 10px;">

<img src="schriftzug.gif" alt="CSH-Schriftzug" width="578" height="97"></div>

<div id="Layer3" style="position:absolute; top:50%; left:350px; z-index:-10; filter:alpha(opacity=30); -moz-opacity: 0.3;"><img src="transparent.gif" width="523" height="240"></div>

<p> </p>

<!-- Content -->

<div id="Content">

wie sprech ich denn den div Content in der ausgelagerten jetzt an? ich kanns schimpfen wie ich will. Er machts ausgelagert nicht und wirft mir zudem die anderen Layer auch durcheinander. Im Quelltext lüppts. Auszug aus der CSS:

div id="Content" { width:760px; margin:0px auto; text-align:left; z-index: 1; word-break: break-all; word-wrap:break-word; }

Auszug aus der CSS:


#Content { width:760px; margin:0px auto; text-align:left; z-index: 1; word-break: break-all; word-wrap:break-word; }

so lüppts...

Huch das ging ja wie der Wind :)

Danke dir. Auf die Möglichkeit wär ich nie gekommen. Probiers gleich mal aus

so lüppts...

jo muss su lüppen ;)

aber dazu noch ne Kleinigkeit:

so sprichst du alle Elemente an deren ID "Content" ist:


#Content { width:760px; margin:0px auto; text-align:left; z-index: 1; word-break: break-all; word-wrap:break-word; }

so sprichst du alle DIV-Elemente an deren ID "Content" ist:

div #Content { width:760px; margin:0px auto; text-align:left; z-index: 1; word-break: break-all; word-wrap:break-word; }

stimmt, hat auch gelüppt.

Spitze, jetzt an das zusätzliche div hätte ich auch nicht gedacht. Wär momentan aber auch nicht so tragisch gewesen.

Allerdings hab ich komischerweise aus der CSS was rausnehmen müssen.

Bei Content das text-align left und beim body das text-align center

Das hat mir die anderen Layer durcheinandergewirbelt. War vorher noch nicht und nach Rausnahme funktionierts komischerweise richtig. Liegt wohl an den beiden word-break/wrap, das er es richtig interpretiert.

so sprichst du alle DIV-Elemente an deren ID "Content" ist:


div #Content { width:760px; margin:0px auto; text-align:left; z-index: 1; word-break: break-all; word-wrap:break-word; }

Ich will ja nicht kleinlich sein, aber um das div mit der ID Content anzusprechen schreibt man:

div#Content { 

} /* Kein Leerzeichen zwischen div und # */

In dieser Schreibweise würdest Du ein Element ansprechen, welches sich innerhalb eines div Containers befindet und als ID Content hat:

<style>

<!--

  div #Content { 

  }

-->

</style>

<div>

  <p id="Content">Hallo Welt!</p>

</div>

Und noch ein Tipp, eine ID darf man nur einmal und für genau ein Element vergeben. So was ist nicht valide:

<div id="Content"></div>

<p id="Content"></p>

Man würde in diesem Fall auf eine Klasse zurückgreifen:

<div class="Content"></div>

<p class="Content"></p>

Gruß Tobias

mit dem einmal vergeben war mir klar. wußte aber ned das es mit der Klasse aber funktioniert :)

wollte mir grade noch mein Scrollayout farblich verschönern, dabei ist der ganze Mist wieder ned W3 konform :(

falscher Alarm. Haut doch mit der Farbe hin. Hatte mich nur vertippselt.

Aber andere Sache. Habe unter den zwei Layern noch ne kleine Tabelle wo das Menü ... drin ist.

Da ich die auch noch in die CSS einbinden wollte, hab ich ihr die Position absolut und top halt 100 px gegeben, so das sie unter den Layern ist.

Nur hab ich das Teil jetzt ganz am oberen Rand :confused:

Ich will ja nicht kleinlich sein, aber um das div mit der ID Content anzusprechen schreibt man:


div#Content { 

} /* Kein Leerzeichen zwischen div und # */

In dieser Schreibweise würdest Du ein Element ansprechen, welches sich innerhalb eines div Containers befindet und als ID Content hat:

<style>

<!--

  div #Content { 

  }

-->

</style>

<div>

  <p id="Content">Hallo Welt!</p>

</div>

Und noch ein Tipp, eine ID darf man nur einmal und für genau ein Element vergeben. So was ist nicht valide:

<div id="Content"></div>

<p id="Content"></p>

Man würde in diesem Fall auf eine Klasse zurückgreifen:

<div class="Content"></div>

<p class="Content"></p>

Gruß Tobias

Sorry, hab das leerzeichen zu viel gemacht :floet:

Archiv

Dieses Thema wurde archiviert und kann nicht mehr beantwortet werden.

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.