I cannot place the logos on the right side of the screen, next to the title, they are below the div on the right side

Asked

Viewed 19 times

-3

html

        <h2>WANTED</h2>
        <div class="">
        </div><!--menu principal-->
        </div><!--header-1-->
        </div><!--logo-->
        <div class="redes-sociais">
            <ul>
                
                <li><a href=""><img src="imagens/instagram.png"></a></li>
                <li><a href=""><img src="imagens/linkedin.png"></a></li>
                <li><a href=""><img src="imagens/twitter.png"></a></li>
                
            </ul>
        </div>
    </main>
</header>

css *{ margin: 0; padding: 0; box-Sizing: border-box; font-family: 'Dela Gothic One', cursive;; }

body{ width: 100%; height: 100%; }

.logo{ color:white; padding: 13px; width: 30%; }

.main menu{ background-color: rgb(0, 0, 0); height: 60px; width: 100%; }

main{ width: 980px; position: relative; margin: 0 auto; }

.social networks ul li{ display:inline-block; width: 20%; float: right; }

1 answer

-3

Take a look at these videos can help you a lot:

https://youtube.com/playlist?list=PLirko8T4cEmx5eBb1-9j6T6Gl4aBtZ_5x

You can use this CSS attr:

style="display: inline-flex;align-items: center;"

So arrange a little your html, you can do something close like this:

<div style="display: inline-flex;align-items: center;">
                <!--menu principal-->
                <div class="">
                    <h2>WANTED</h2>
                </div>

                <!--logo-->
                <div class="redes-sociais">
                    <ul>

                        <li>
                            <a href=""><img src="https://picsum.photos/200"></a>
                        </li>
                        <li>
                            <a href=""><img src="https://picsum.photos/200"></a>
                        </li>
                        <li>
                            <a href=""><img src="https://picsum.photos/200"></a>
                        </li>

                    </ul>
                </div>
            </div>

inserir a descrição da imagem aqui

Browser other questions tagged

You are not signed in. Login or sign up in order to post.