Tabelle in html mit CSS verschieben?

Habe eine Tabelle:

<table class="anker"

<tr>

<td>Anker 1</td>

</tr>

wollte die tabelle dann mit css:

table.anker{

margin-top: 50px;}

verschieben, aber wenn verschoben wird verschwinden die rahmen von der Tabelle

1 Antwort

regex9

Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer

Computer, Technik, HTML

19.12.2020, 19:46

Du hast da nicht nur eine Tabelle, sondern zwei. Wobei bei der zweiten Tabelle der Tag unvollständig ist.

So sollte es aussehen:

<table class="anker">
  <tr>
    <td>Anker 1</td>
    <td>Anker 1</td>
  </tr>
</table>

Da das border-Attribut obsolet ist, sollte der Rahmen stattdessen via CSS gesetzt werden.

table,
th,
td {
  border: 1px solid;
}

table.anker {
  margin-top: 50px;
}

ImmerVergeben

Fragesteller

19.12.2020, 19:51

oh wow. danke es hat geklappt

Ähnliche Fragen

Border-Radius in Tabellen ohne CSS?

Hi zusammen,

die Frage ist mir zwar etwas peinlich, aber ich bekomme es nicht gelöst und brauche mal eure Hilfe.

Weiß jemand wir man die Ecken einer Tabelle abgerundet bekommt, ohne dafür css zu verwenden?

Ich habe nämlich folgendes Problem:

Ich versuche, ein neues Email-Template zu bauen. Leider werden je nach E-Mailprogramm einige CSS Befehle nicht erkannt (Outlook). Da ich nicht mit Bildern arbeiten möchte, suche ich hierzu eine „reine HTML-Lösung“.

oder:

Wenn jemand, weiß wie man Outlook dazu bringen kann auf Border-Radius (css) zu reagieren, nehme ich auch gerne jeden anderen Vorschlag an ^^

Lieben Dank schon mal 😊

<table class="emailTable">
    <tr class="firstTR">
        <td>1</td>
        <td>2</td>
     </tr>
</table>

...zur Frage

CSS-Table zentrieren?

Hallo!

Ich möchte dieses Diagramm und diese Tabelle zentrieren? Doch wie geht das?



<div id="curve_chart" style="width: 900px; height: 500px"></div>

<table class="center">
    <thead>
        <tr>
            <th>ID</th>
            <th>Temperatur</th>
            <th>Zeitpunkt</th>
        </tr>
    </thead>
    <tbody>
        {% for temp in temps %}
        <tr>
            <td>{{temp.id }}</td>
            <td>{{temp.temperatur }}</td>
            <td>{{temp.zeitpunkt }}</td>
        </tr>
        
        {% endfor %}
        
    </tbody>
</table>


{% endblock %}

...zur Frage

dynamische Tabelle mit php erzeugen?

Hallo, ich will eine dynamische tabelle mit php erzeugen. Die zahlen sollten hochzählen und die reihen und spalten sollten sich oben in der leiste durch eingabe ändern lassen. Bisher habe ich das:

<table>
<?php
$rows =10;
$cols =20;
$zahl=1;
for ($tr = 0; $tr < $rows; $tr++) {
  echo '<tr>';
for ($td = 0; $td < $cols; $td++) {
  echo'<td> </td>';
    $zahl++;
  {
echo '</tr>;
}
?>
</table>

Leider komme ich jetzt nicht mehr weiter

...zur Frage

Css Table Design?

Hi ich würde gerne die Border ganz schwarz machen habe auch

border: #black

aber irgendwie ist die border noch grau innen wie bekomme ich das weg?

hab table, td und tr auf schwarz :)))) bitte jemand helfen :p

...zur Frage

Css Elemente nebeneinander und nicht untereinander?

Wie kann ich diese Elemente so positionieren, dass sie nebeneinander und nicht untereinander sind?

HTML:

  <div>
    <div v-for="recipe in recipes" :key="recipe.id">
      <div class="recipe">
        <img class="recipe-img" :src="recipe.img" alt="" />
        <div class="recipe-description">
          <h3 class="recipe-title">{{ recipe.title }}</h3>
          <h4 class="recipe-time">
            <i class="far fa-clock"></i> {{ recipe.time }} Minutes
          </h4>
          <h4 class="level">
            <i class="far fa-check-circle"></i> {{ recipe.level }} to make
          </h4>
        </div>
      </div>
    </div>
  </div>

CSS:

.recipe-img {
  width: 300px;
  height: 300px;
  object-fit: cover;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}


.recipe {
  margin: 30px;
}


.recipe-description {
  text-align: center;
  margin-top: 10px;
  border: 1px solid #444;
  border-top: none;
  padding: 10px;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  background-color: #444;
  color: white;
  width: 300px;
}


.recipe-title,
.recipe-time,
.recipe-level {
  margin: 5px;
}

...zur Frage

CSS: Wie kann ich die Unterlinie des Texts wegbekommen?

Hallo. Irgendwie geht die text-decoration bei mir nicht weg. Bitte helft mir.

HTML:

 <button class="cn"><a href="#">create</a></button>

CSS:

.cn {
  text-decoration: none;
  width: 160px;
  height: 40px;
  background: #23002f;
  border: none;
  margin-bottom: 10px;
  margin-left: 20px;
  font-size: 18px;
  border-radius: 10px;
  cursor: pointer;
  transition: .4s ease;
  margin-left: 350px;
  margin-top: 5px;
}

...zur Frage

PHP: Ergebnis erst später aufdecken nach Antwort?

Hey,

ich habe folgenden html und php-Code.

<form action="Subtraktion (1).php" method="post" target="">
<table>
<tr>
<td><font face="Roboto Slab" size=+1>Anzahl der Aufgaben eingeben</font></td>
<td><input type="Text" name="z" value="" size="" maxlength=""></input></td>
<td align="center"><input type="submit"  style="font-family: 'Roboto Slab'"  background-color="black" name="y" value="Absenden"></td></tr>
</table>
<br>
</form>

<?php
if((isset($_POST['z'])) and (is_numeric($_POST['z'])))
{
$zahl = $_POST['z'];

{

 while($zahl>0)
  {

  $a = rand(5, 10);
  $b = rand(0, 5);
  $erg = $a - $b;
  $zahl = $zahl - 1;

  echo "<table class='Tab'>";
  echo "<table border='1'>";
  echo "<tr> <td>$a - $b = ?</td> <td><input type=\"Text\" name=\g\"  value=\"\">\n</td><td>$a - $b = $erg</td></tr>";
  echo "</table>";
}
}}

?>
</body>
</html>

Damit soll der Nutzer Aufgaben – so viel wie er anfangs ausgewählt hat, berechnet können. Die Aufgaben bestehen hierbei aus zufälligen Zahlen. Meine Frage wäre jetzt: wie ich es schaffen kann (mit eher einfachen Befehlen), den Code so zu schreiben, dass das Ergebnis – hier: $a - $b = $erg – erst enthüllt wird, sobald der Nutzer ins Textfeld seine Antwort zur Aufgabe eingegeben hat?

Hier nochmals die Stelle (auch oben zusammen mit dem gesamten Code sichtbar):

echo "<table class='Tab'>";
echo "<table border='1'>";
echo "<tr> <td>$a - $b = ?</td> <td><input type=\"Text\" name=\g\" value=\"\">\n</td><td>$a - $b = $erg</td></tr>";
echo "</table>";

Vielen Dank :)

...zur Frage

Einzelne Schriften in HTML Bearbeiten?

Hallo,

ich habe vor kurzem begonnen eine Website mit HTML zu programmieren, dazu nutze ich Visual Studio Code, aber ich mache das ganz noch nicht so lange, also kenne ich mich noch nicht so gut aus. Zurzeit versuche ich eine Tabelle mit verschiedenen Raritäten zu erstellen. Dazu soll z.B. "Rare" einen blauen Rahmen bekommen, so ähnlich wie in Bild 1 zusehen.

Ich habe schon versucht es zu schaffen, dennoch habe ich bisher nur hinbekommen um alles einen Rahmen zu kreieren.

Meine Frage ist nun, wie man das individuell anpassen kann. So brauche ich die Rahmen nur bei den Namen der Raritäten und diese sollen jeweils eine eigene Farbe haben (z.B. "Rare" = blau, "Epic" = Violett usw.). Außerdem soll der Rahmen genau passen. So ist es bei mir oben so, dass es für "Uncommon" passt, aber für "Epic" viel zu groß ist. Meine Skills in HTML reichen bisher nur die Rahmen für alle zu machen. Ich habe den Style so gemacht:

CSS:

table tr td
{
  font-size: 1.2em;
  background: #fff;
  color: black;
  border-radius: 20px;
  padding: 4px 10px;
}

Vermutlich nicht besonders gut, aber da hoffe ich auf eure Hilfe 😅 Falls es euch etwas hilft, schreib' ich hier noch ein Beispiel hin, wie ich die Tabelle gemacht habe (das Richtige ist natürlich länger)

HTML:

<table>
  <thead>
    <tr>
      <th>Eyes</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Normal</td>
      <td>23.99%</td>
      <td>Common</td>
    </tr>
  </tbody>
  <tfoot>
  </tfoot>
</table>

...zur Frage

Html in ein td ein icon einbauen?

Hallo.

Wie kriege ich es hin das ich in ein td also

<table>

<tr>

</tr>

</table>

Also sowas <box-icon name='trash'></box-icon> da rein wegen zwischen den td klappt nicht habe ich ausprobiert und ja wenn's geht sollte im td stehen

Danke im Voraus.

...zur Frage

PHP – Textfeld in der Tabellenzelle "unsichtbar" machen?

Hallo, liebe Community!

Ich habe eine Tabelle in php erstellt, damit dort meine Werte und Variablen geordnet eingegeben werden können.

Wie kann ich nun das Textfeld in die Tabellenzelle so einfügen, dass es diese gesamt füllt? Also dass es sich so anfühlt, als würde ich direkt in die Zelle schreiben.

Das wäre meine bisheriger Code:

echo "<table class='Tabelle'>";

echo "<table border='1'>";

echo "<tr> <td>$a </td> <td><br><input type=\"\" style=\"border: none\" name=\"g\" value=\"\">\n</td> <td>Summe von $a - $b = $c</></tr>";

echo "</table>";

LG, Jim

...zur Frage

Wie kann ich bei dieser Website den Link nach oben rechts verschieben?

Ich habe einen Link erstellt, der mich wieder zurück zur Hauptwebsite bringt. Nur möchte ich, dass der Link oben rechts ist. Kann mir da jemand helfen?

Die Webseite:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Preise</title>
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap" rel="stylesheet">
  <style>
    body {
      font-family: 'Open Sans', sans-serif;
      padding-left: 100px;
      padding-right: 100px;
    }

    .preise-navbar {
      padding-left: 100px;
      color: rgb(52, 57, 56);
    }

    .preise-container {
      background-color: white;
      padding: 16px;
    }

    table {
      border-collapse: collapse;
    }

    td,
    th {
      padding: 16px;
      border-bottom: 2px solid #8ebf42;
      text-align: center;
      padding-left: 100px;
    }

    a {
    }
  </style>
</head>
<body>
  <div class="preise-container">
    <h1 class="preise-navbar">Preise:</h1>
  </div>
  <table>
    <tr>
      <th></th>
      <th></th>
    </tr>
    <tr>
      <td>Erwachsene:</td>
      <td>20€</td>
    </tr>
    <tr>
      <td>Kinder unter 18</td>
      <td>10€</td>
    </tr>
    <td>Kinder unter 6</td>
    <td>3€</td>
  </table>
  <a href="Index.html">Zurück</a>
</body>
</html>

...zur Frage

Wie kann ich mit Javascript eine Zeile einer (HTML)Tabelle auslesen?

<table width="840px" height="100px" border="solid">
<tr>
<td width="270px" align="center" id="eineID">
50
</td>
<td>
<script type="text/javascript">
//auslesen der 50
</script>
</td>
</tr>
</table>

...zur Frage

PHP: Werte in ein Texfeld eingeben und dann vergleichen?

Hallo,

ich habe ein PHP-Dokument erstellt, mit dem man Rechnenaufgaben lösen soll. Dazu wählt man zuerst die Anzahl der Übungen aus, welche schließlich mit Zufallszahlen generiert werden.

In der Theorie soll dann in der zweiten Spalte vom Nutzer das Ergebnis eingegeben werden. Sobald dies getan wurde, wird dem Nutzer in der dritten Spalte mitgeteilt, ob seine Antwort richtig oder falsch ist.

Ich weiß aber leider nicht, wie ich das realisieren soll.

Ich habe folgenden Code (auch als Bild):

<?php
  if ((isset($_POST['z'])) and (is_numeric($_POST['z']))) {
    $zahl = $_POST['z'];
    {
      while ($zahl > 0) {
        $a = rand(0, 10);
        $b = rand(0, 10);
        $sum = $a + $b;
        $zahl = $zahl - 1;

        echo "<table class='Tab'>";
        echo "<table border='1'>";
        echo "<tr> <td>$a + $b = ?</td> <td><br><input type=\"Text\" name=\"g\" value=\"\">\n</td><td>$a + $b = $sum</td></tr>";
        echo "</table>";
      }
    }
  }
?>

...zur Frage

Mit CSS zwei verschiedene Tabellen verschönern?

Habe in CSS grad ne Tabelle die ich mit:

table{

width:100%;

background-color: black;

border-style: none;

height: 70px;

color: white;

text-align: center;

font: 200% serif;

}

verschönert habe. Habe jetzt aber noch eine andere Tabelle die ich andere Eigenschaften geben möchte. Wie mache ich das jetzt?

...zur Frage

Was möchtest Du wissen?

Deine Frage stellen