• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

div aus Textfluss nehmen

opmil

New member
Salüü

Ich versuche gerade ein kleines Suggest zu programmieren. Jetzt habe ich aber Probleme mit der Datenausgabe. Wie kann ich ein <div> Element aus dem Textfluss nehmen? Habe bis jetzt folgenden CSS teil:
Code:
.suggest_0{
  top:146px;
  left:auto;
  position:absolute;
  width: 175px;
  border: 1px solid #000000;
  text-align:left;
  overflow:hidden;
  background-color: #CCCCCC;
}

Leider funktioniert das mit dem IE überhaupt nicht. Dieser stellt das ganze nicht unterhalb des <input> Element dar, sondern neben diesem.

Hier noch das Form:
HTML:
<form name="search" action="?action=found" method="post"">
  <input type="text" size="25" name="searchkey" id="searchkey" />
  <input type="submit" name="send" id="send" value="Suchen" />
  <div id="suggest_0" class="suggest_0"> </div>
</form

Besten Dank & Gruss
 
Hier noch ein Bild für das bessere Verständnis

Im Fx, Opera und Safari sieht die Darstellung ungefähr so aus:


Im IE7 so:
 
Vergib einen festen Wert für left. Zusätzlich solltest Du noch dafür sorgen, daß dieser in allen Browsern auf's Gleiche hinausläuft.
 
Vergib einen festen Wert für left. Zusätzlich solltest Du noch dafür sorgen, daß dieser in allen Browsern auf's Gleiche hinausläuft.

Das habe ich auch schon gemacht. Bringt aber nichts, da meine Seite zentriert ist. Das heisst, dass falls jemand eine andere Auflösung hat, sich das ganze verschiebt.
 
Schwer zu sagen, wenn man die genauen Anforderungen nicht kennt.
PHP:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>Zentriertes Zeug</title>
<style type="text/css">
html,body{
margin:0;
padding:0;
}
body{
padding:8px;
}
#suggest_0{
top:24px;
left:0;
position:absolute;
width:175px;
height:150px;
border:1px solid #000;
overflow:hidden;
background-color:#ccc;
}
#seite{
position:relative;
width:80%;
margin:0 auto;
background-color:#ddd;
}
#search{
height:24px;
margin:0;
padding:0;
}
</style>
</head>
<body>
<div id="seite">
<form name="search" id="search" action="?action=found" method="post">
<input type="text" size="25" name="searchkey">
<input type="submit" name="send" value="Suchen">
<div id="suggest_0">blah</div>
</form>
</div>
</body>
</html>
 
Falls Du den body mit text-align:center zentriert hast, kannst Du - wenn Du das so lassen willst - natürlich auch im Beispiel von undefined die id search mit text-align:left auf Position bringen, "sauberer" ist es allerdings wie da beschrieben.
 
Zurück
Oben