Sunday, 20 December 2015

Need help with something my teacher couldn't figure out

So for my advanced web design class at my high school I have to create a website for a small business in my area. I found a small diner and talked to them and confirmed all the details and I've been putting it together.

The hardest page that I'm working on is actually recreating their menu using code. I made the entire menu responsive because the way it's laid out I divided everything up into separate divs. Each heading for example Appetizers or Soups is clickable and I used jQuery's accordion feature to make each heading drop down and show the specific options that the diner offers.

Now I have it set up as an unorganized list that lists all of the options in each div, but I'm unsure of how to get the prices on the right side of the div because I'm using a <ul> tag to write each menu item, should I just change it all to <p> tags and make it a specific class and have there be 2 divs inside each div that expands, and just make the second div have text aligned to the right and that div show the prices?

Sorry I'm relatively bad at web design because I was self taught and I missed a lot of simple things that I'm just now learning because I finally took the class my school offered.

Also another shameless question, I'm having trouble with the #header div trying to make it responsive to different sized screens, it looks fine on mine but on smaller screens it looks kinda bad. How can I edit that to make it look the same when I zoom in/out.

EDIT: Here's a codepen version of my site: http://ift.tt/1UTqGO0



Epic visual tool

Epson 5030UB 2D/3D 1080p 3LCD Projector Submitted December 21, 2015 at 12:07AM by SC2Sycophant http://ift.tt/1RyML5Q

No comments:

Post a Comment