Verschiedene Elemente positionieren sich in einem Flexbox -ReagierenCSS

CSS verstehen
Anonymous
 Verschiedene Elemente positionieren sich in einem Flexbox -Reagieren

Post by Anonymous »

Ich versuche, verschiedene Bildelemente in meinem Heldenabschnitt hinzuzufügen, Referenzfoto unten, und versuche, diese beiden Cursors hinzuzufügen. Im Moment ist die Position absolut, weshalb die Größe der Größe auf der vordefinierten Position festgelegt ist.
Image

Image


);
}
export default Hero;

.cursor1{
width: 80px;
height: 60px;
position: absolute;
top: 500px;
left: 500px;
}

.cursor2{
width: 100px;
height: 60px;
position: absolute;
top: 400px;
right: 550px;
}

.hero{
padding: 200px 0;
text-align: center;
align-items: center;
display: flex;
justify-content: center;
}

.hero-content{
max-width: 800px;
padding: 100px 0px;
text-align: center;
align-items: center;
justify-content: center;
display: flex;
flex-direction: column;
padding-left: 112px;
padding-right: 112px;
padding-top: 64px;
padding-bottom: 64px;
margin-left: 240px;
margin-right: 240px;
}

.hero-content h1{
font-weight: 900;
font-size: 80px;
color: #3B519E;
text-align: center;
align-items: center;
margin: 0;
}
< /code>
Irgendwelche Ideen, wie ich dies erreichen kann, dass es reagiert? Vielen Dank! Ich weiß nicht, wie ich den CSS -Code auf einem anderen Panel hier auf Stack hinzufügen kann.

Quick Reply

Change Text Case: 
   
  • Similar Topics
    Replies
    Views
    Last post