Logo crisis

HTML & CSS
1

Hello,

please see

i want the logo to be to the far left, the rest of my navigation to the right

i want the logo to be an image or text

please be sure its responsive :slight_smile:

i have tried EVERYTHING, no go

i am not even sure my nav is coded properly to actualy acheive my goal!

i am FULLY aware there is code in my CSS that doesnt belong there… i tried removing what i thought was pointles, but broke my code :frowning:

please help me!

maybe another codepen with what i need?

thank you!!!

2

Here is a simple way of doing it:

It is responsive!

1 Like
3

You need to stretch the ul so it takes up the available width and then you can just use a margin-right auto on the logo to push the other items all the way over to the right.

nav {
  display: flex;
  /*justify-content: end;*/
}
nav .menu{flex:1 0 0;align-items:center;}
nav .menu .logo{ margin-right:auto;}

I’ve mentioned this before but you cannot have a div as a direct child of a ul!! Only list items can be direct children so change the div to a list item.

    <ul class="menu">
      <li class="logo">Logo</li>
      <li><a href="#">About Buck Island</a></li>
etc...
4

BINGO!!!

thanks >SO< much!

i put some time into this without solving my issue… crisis averted!

down the line i may change the logo to an image… do you care to address this now or when i am there?

yes, my fault… honest mistake

best i can do is to try not making that mistake again

i do appreciate you never coming down on me or calling me stupid :slight_smile:

i will give you %0.00000000000001 of my first million… sound fair?

you may have noticed this new code i am sharing with you… i have a possible gig lined up so i am trying to get started.

wish me luck!

any words of wisdom?

again, THANK YOU!!!

1 Like