tutorials.de Buch-Aktion 05/2012
ERLEDIGT
JA
ANTWORTEN
4
ZUGRIFFE
280
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
DIESES THEMA IST
GESCHLOSSEN
  1. 04.09.06 15:48 #1
    packman packman ist offline Mitglied
    Registriert seit
    Sep 2006
    Beiträge
    18
    Hallo zusammen ich habe ein Problem mit der positiunierung im CSS. Ich habe meine Seite folgend aufgebaut: ein page das die ganze Seite darstelt darunter einen banner der sich der ganzen länge erstreckt und drunter sollte links ein menu sein und nebendran der der inhalt (content) der Homepage. Die Seite sollte auf Firefox und IE laufen. bei mir wird das menu immer falsch dargestellt, kann mir jemand helfen?

    So solte die page aussehen:

    PHP-Code:
    |--------------------------page--|
    |                                |
    |----------------------    banner----|
    |              BANNER                |
    |--------------------------------|
    |                                |
    |-    menu--|--------content---------|
    |       |                        |
    |     LINK1 |  TEXT...               |
    |     LINK2 |  ...........           |
    |     LINK3 |                        |
    |       |                        |
    |       |                        |
    |       |                        |
    |       |                        |
    |       |                        |
    |       |                        |
    |       |                        |
    |       |                        |
    |       |                        |
    |       |                        |
    |-------|------------------------| 
     
  2. 04.09.06 16:16 #2
    Maik Tutorials.de Gastzugang
    Könntest Du mal den dazugehörigen Quellcode (HTML + CSS) zeigen?
     
  3. 04.09.06 16:31 #3
    packman packman ist offline Mitglied
    Registriert seit
    Sep 2006
    Beiträge
    18
    HTML-Code:
    <html>
<head>
<title>CSS TestPage</title>
<style type="text/css">
body
{
	background-color:#CCCCCC;
}

#page
{
	width:760px;
	margin:0px auto;
	text-align:left;
	background-color:#bdbec6;
	border:1px solid #000000;
}

#banner
{
	font-size : 24px;
	font-weight : bold;
	background-color : #8888FF;
	margin-bottom : 20px;
	border: solid;
}

#menu
{
	float:left;
	border: solid;
	margin-right: 20px;
	width: 100px;
	
}

#content
{
	float:right;
	border: solid #FFFFFF;
}

</style>

</head>

<body>
<div id="page">
	<div id="banner">Banner</div>
	<div id="menu">Menu <br/>
		<a class="menu_link" href="http//:www.googel.ch" >Google</a> <br/>
	</div>
	<div id="content">
		<p>
		Nach Angaben von Rettungskräften war Irwin auf der Stelle tot; die mit einem Helikopter eingeflogenen Rettungskräfte konnten ihm nicht mehr helfen. Irwin sei durch Herzstillstand gestorben, sagte der Notarzt.

		Der Dokumentarfilmer hatte in der beeindruckenden Unterwasserlandschaft des Great Barrier Reef vor der Nordostküste Australiens an einem Dokumentarfilm gearbeitet. Die scheuen Stachelrochen haben an ihrer Schwanzflosse einen giftigen Stachel, den sie als Waffe einsetzen, wenn sie sich bedroht fühlen.

		Irwin habe sich mit den Dreharbeiten so nahe an Stachelrochen in höchste Gefahr begeben, sagte der australische Naturfilmer David Ireland. "Sie haben einen oder zwei Stachel am Schwanz, die nicht nur von Gift umhüllt sind, sondern auch wie ein Bajonett wirken", erläuterte Ireland.

		Der Australier, dessen Markenzeichen Khaki-farbene Shorts und Hemden waren, war über die Landesgrenzen hinweg mit Fernsehsendungen berühmt geworden, in denen er sich ohne Scheu mit wilden Tieren umgab.
		</p>
	</div>
</div>

</body>
</html>
    ich habe extra paar border gemacht das ich die anordnung besser erkennen kann
     
  4. 04.09.06 16:44 #4
    Maik Tutorials.de Gastzugang
    Und hier der überarbeitete Quellcode

    HTML-Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>CSS TestPage</title>
<style type="text/css">
body
{
        background-color:#CCCCCC;
}

#page
{
        width:760px;
        margin:0 auto;
        text-align: left;
        background-color:#bdbec6;
        border:1px solid #000000;
}

#banner
{
        font-size:24px;
        font-weight:bold;
        background-color:#8888FF;
        margin-bottom: 20px;
}

#menu
{
        float:left;
        width: 100px;
        border: 1px solid #fff;
}

#content
{
        border: 1px solid #FFFFFF;
        margin-left: 120px;
}

div.clear { /* stellt nach den floatenden Boxen wieder den normalen Textfluss her */
clear: left;
font-size: 1px;
height: 0;
line-height: 0;
margin: 0;
padding: 0;
}
</style>

</head>

<body>
<div id="page">
        <div id="banner">Banner</div>
        <div id="menu">Menu <br/>
                <a class="menu_link" href="http//:www.googel.ch" >Google</a> <br/>
        </div>
        <div id="content">
                <p>
                Nach Angaben von Rettungskräften war Irwin auf der Stelle tot; die mit einem Helikopter eingeflogenen Rettungskräfte konnten ihm nicht mehr helfen. Irwin sei durch Herzstillstand gestorben, sagte der Notarzt.

                Der Dokumentarfilmer hatte in der beeindruckenden Unterwasserlandschaft des Great Barrier Reef vor der Nordostküste Australiens an einem Dokumentarfilm gearbeitet. Die scheuen Stachelrochen haben an ihrer Schwanzflosse einen giftigen Stachel, den sie als Waffe einsetzen, wenn sie sich bedroht fühlen.

                Irwin habe sich mit den Dreharbeiten so nahe an Stachelrochen in höchste Gefahr begeben, sagte der australische Naturfilmer David Ireland. "Sie haben einen oder zwei Stachel am Schwanz, die nicht nur von Gift umhüllt sind, sondern auch wie ein Bajonett wirken", erläuterte Ireland.

                Der Australier, dessen Markenzeichen Khaki-farbene Shorts und Hemden waren, war über die Landesgrenzen hinweg mit Fernsehsendungen berühmt geworden, in denen er sich ohne Scheu mit wilden Tieren umgab.
                </p>
        </div>

        <div class="clear">&nbsp;</div>
</div>

</body>
</html>
     
  5. 04.09.06 16:51 #5
    packman packman ist offline Mitglied
    Registriert seit
    Sep 2006
    Beiträge
    18
    Danke, genau so hab ichs mir vorgestellt
     
« CSS Layout - fixe Seite und Scrollseite | Hintergrundbild wiederholt sich nicht »

Ähnliche Themen

  1. Positionierungsproblem mit CSS
    Von d4rksid0r im Forum CSS
    Antworten: 2
    Letzter Beitrag: 31.08.10, 14:04
  2. Positionierungsproblem im IE
    Von counteract im Forum CSS
    Antworten: 2
    Letzter Beitrag: 20.08.09, 15:53
  3. Positionierungsproblem
    Von queicherius im Forum CSS
    Antworten: 2
    Letzter Beitrag: 17.08.09, 14:19
  4. Div Positionierungsproblem nebeneinander
    Von Flame im Forum CSS
    Antworten: 3
    Letzter Beitrag: 20.11.07, 06:37
  5. positionierungsproblem
    Von damienhirst12 im Forum CSS
    Antworten: 4
    Letzter Beitrag: 02.03.02, 14:42