textarea auf jpg-Hintergrund platzieren aber wie?

adeluxe

Grünschnabel
hallo!

ich möchte auf einem jpg das auch mein hintergrund ist, ein textfeld mit scrollfunktion einfügen.
das hintergrundbild habe ich mit css in die html datei eingebunden und das hat geklappt.

hat jemand eine idee wie ich jetzt das textfeld auf das bild bekomme :confused:


(danach müssen weitere jpg´s auf den hintergrund das weiß ich auch noch nicht wie das geht)


vielen dank
 
Hi,

geh ich recht in der Annahmne, dass das <textarea>-Tag über dem Seitenhintergrundbild positioniert werden soll?

Dann wären folgende CSS-Eigenschaften für Dich von Interesse:
Und achte hier bitte auf die Netiquette (Nr.15) bzgl. Deiner durchgängigen Kleinschreibung - vielen Dank! :)

mfg Maik
 
Hi,



indem Du die Textarea in den Container mit dem Hintergrundbild packst. Wo ist das Problem?

LG
und wo genau

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
<title>Limitplanung</title>
<link href="css.css" rel="stylesheet" type="text/css">

<style type="text/css">
background{
background-color:white;
background-image:url(05_Hintergrund.jpg);
background-repeat:no-repeat;
background-position:center;
}
textarea{
margin-right:auto;
margin-left:auto;
padding:0px;
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:12px;
color: #000000;
text-align:left;
background-color: #FFFFFF;
rows:25;
cols:50;
}

</style>
</head>

<body>
<div id= "background"></div>
<div align="center"><img src="05_Hintergrund.jpg"border="0">
<div id="textarea"></div>
<div align="center">



</body>
</html>
 
Bitte achte nächstes mal darauf den Code in die dazu gehörigen Boxen zu stellen (im Editor 2.Zeile rechts) und validen Quellcode zu präsentieren.

HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
<title>Limitplanung</title>
<link href="css.css" rel="stylesheet" type="text/css">

<style type="text/css">
#background{
background-color:white;
background-image:url(05_Hintergrund.jpg);
background-repeat:no-repeat;
background-position:center;
}
textarea{
margin-right:auto;
margin-left:auto;
padding:0px;
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:12px;
color: #000000;
text-align:left;
background-color: #FFFFFF;
rows:25;
cols:50;
}

</style>
</head>

<body>
<div id= "background">
    <textarea></textarea>
</div>


</body>
</html>

Nicht getestet
 
Zuletzt bearbeitet:
Hier fehlt das erforderliche "#"-Zeichen vor den ID-Bezeichnern:
Code:
#background{
background-color:white;
background-image:url(05_Hintergrund.jpg);
background-repeat:no-repeat;
background-position:center;
}
#textarea{
margin-right:auto;
margin-left:auto;
padding:0px;
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:12px;
color: #000000;
text-align:left;
background-color: #FFFFFF;
rows:25;
cols:50;
}

Möglicherweise ist es damit getan, das DIV #textarea in das DIV #background einzubetten:
Code:
<body>
<div id= "background">
    <div id="textarea"></div>
</div>
</body>

mfg Maik
 
Bitte achte nächstes mal darauf validen Quellcode zu präsentieren.

HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
<title>Limitplanung</title>
<link href="css.css" rel="stylesheet" type="text/css">

<style type="text/css">
#background{
background-color:white;
background-image:url(05_Hintergrund.jpg);
background-repeat:no-repeat;
background-position:center;
}
textarea{
margin-right:auto;
margin-left:auto;
padding:0px;
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:12px;
color: #000000;
text-align:left;
background-color: #FFFFFF;
rows:25;
cols:50;
}

</style>
</head>

<body>
<div id= "background">
    <textarea></textarea>
</div>


</body>
</html>
Ist dein präsentierter Quellcode etwa valide?

mfg Maik
 
:-(

Aber so:

HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
<title>Limitplanung</title>
<link href="css.css" rel="stylesheet" type="text/css">

<style type="text/css">
#background{
background-color:white;
background-image:url(05_Hintergrund.jpg);
background-repeat:no-repeat;
background-position:center;
}
textarea{
margin-right:auto;
margin-left:auto;
padding:0px;
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:12px;
color: #000000;
text-align:left;
background-color: #FFFFFF;
}

</style>
</head>

<body>
<div id= "background">
    <textarea rows="25" cols="50"></textarea>
</div>


</body>
</html>
 
Hier fehlt das erforderliche "#"-Zeichen vor den ID-Bezeichnern:
Code:
#background{
background-color:white;
background-image:url(05_Hintergrund.jpg);
background-repeat:no-repeat;
background-position:center;
}
#textarea{
margin-right:auto;
margin-left:auto;
padding:0px;
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:12px;
color: #000000;
text-align:left;
background-color: #FFFFFF;
rows:25;
cols:50;
}

Möglicherweise ist es damit getan, das DIV #textarea in das DIV #background einzubetten:
Code:
<body>
<div id= "background">
    <div align="center"><img src="05_Hintergrund.jpg"border="0">
    <div id="textarea"></div>
    <div align="center"></div>
</div>
</body>

mfg Maik

Danke für den Tip.
HAb gleich versucht.
Jetzt ist das Textfeld ganz weg. Der Hintergrund wird angezeigt(vorher war das Textfeld noch unter dem jpg)
 

Neue Beiträge

Zurück