branch wieder master; layout orange

src/components/Dog.css

@@ -0,0 +1,14 @@
+.Dog  
+.Content
+{
+    font-weight: bold;
+    margin: 5px;
+}
+
+.neben
+{
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+}

src/components/Dog.tsx

@@ -3,6 +3,7 @@ import React, { useContext, useState } from 'react'
 import { useParams } from "react-router-dom";
 import Img from './Img';
 import DogNameTxt from './DogNameTxt';
+import './Dog.css';
 
 const Dog = () => 
 {
@@ -32,7 +33,7 @@ const Dog = () =>
   }
 
   return (
-    <div>
+    <div className = 'Dog'>
       <h1>Hast Du mich gefunden?</h1>
       {/* <p>name: {name}</p>
       <p>email: {email}</p>

src/components/DogNameTxt.tsx

@@ -5,9 +5,9 @@ export default function DogNameTxt(
     {name: string, email: string, phone: string}) {
   return (
     <div>
-      <p>Hallo ich bin die <p>{name}!</p></p>
-      <p>bitte schreib eine Mail an <p>{email}</p>  
-      oder ruf <p>{phone} an,</p>damit ich schnell wieder Heim komme.</p>
+      <p>Hallo ich bin <p className='Content'>{name}!</p></p>
+      <p>bitte schreib eine Mail an <p className='Content'>{email}</p>  
+      oder ruf <div className='neben'><div className='Content'>{phone}</div> an,</div> damit ich schnell wieder Heim komme.</p>
     </div>
   )
 }