search

emmamamula / Yugoslav-Folklore

Gender analysis of Yugoslav folk songs and poetry.
1 stars 0 forks source link

Issue with centering of menu #17

Open emmamamula opened 5 years ago

djbpitt commented 5 years ago

@ddaud02 I've pushed two new files in the site subdirectory to GitHub: index_djb.xhtml and index_djb.css. They aren’t on Obdurodon, but if you pull from GitHub and then open index_djb.xhtml in a browser, the menu should be centered. Aside from some general cleanup (e.g., I removed the audio player; we can put that back later, if you want), the main changes I made were to:

  1. Simplify the HTML around the navigation menu. For example, I removed the extra <nav> element (there were two, one inside the other) and the has-background2 <div> wrapper (which didn’t seem to be doing anything).
  2. The <nav> is now a child of <main>, and it has a display type of flex. It has a single child element, the outer <ul> for the menu. The flex container sets the flex-direction to row (horizontal orientation) and the justify-content property to center, which makes its single child, the <ul>, center itself inside the <nav> wrapper.

Let me know if anything is unclear. I think some more cleanup is probably needed; and if you’d like to schedule an extra meeting to review the HTML and CSS for the main page after you’ve had a chance to do what still needs to be done with it, let me know and I’ll be happy to do that.

ddaud02 commented 5 years ago

Thanks, @djbpitt, I added all the corrections to the main page. I also changed the background picture, I specifically find one with no copyrights. I also added the music to the last section instead of the same one with the menu and used this code

to center it. it looks like this now.

screen shot 2019-02-28 at 9 12 42 am
djbpitt commented 5 years ago

@ddaud02 The centering works, but there's an oddity in that the <ul> child of <nav> has 40px of left padding. That’s the buillt-in default, and you can squash it by specifying padding: 0 on that <ul>. Another oddity is that the border under the drop-down submenus extends to the left of the menu items. The simplest way to fix that would be to remove the bottom border, but if you really, really, really want to keep it, you’ll want to figure out how to control its length.

I’ve toggled the label back to “bug”, pending resolution of these two issues.

ddaud02 commented 5 years ago

Thanks again @djbpitt, I will try to figure out.