nyuille

yes, ok, i got it. thank you!

Hi - Does it make sense to have this much syntax for styling links or can it be done more concisely? The main idea is to change the color on hover and active links to dark blue background and white text. Also, I had to have two different sets for two-col vs. three-col because I needed different padding inside the links box. .two-col a:link, .two-col a:visited { background-color: white; border: solid black 1px; color: rgb(0, 57, 90); display: block; padding: 14px 230px 14px 230px; text-decoration: none; } .two-col a:hover, .two-col a:active { background-color: rgb(0, 57, 90); border: solid black 1px; color: white; display: block; padding: 14px 230px 14px 230px; text-decoration: none; } .three-col a:link, .three-col a:visited { background-color: white; border: solid black 1px; color: rgb(0, 57, 90); display: block; padding: 14px 80px 14px 80px; text-align: center; text-decoration: none; } .three-col a:hover, .three-col a:active { background-color: rgb(0, 57, 90); border: solid black 1px; color: white; display: block; padding: 14px 80px 14px 80px; text-align: center; text-decoration: none; }

yes, I get it! Thank you so much for clarifying and your time. I really do appreciate it.

One other question about your code: .row > div > p, .row > div > div {padding: 0 15px; } .row p {background-color: orange;} You don't put > before p on second line. Is that optional?

yes, ok, i see! thank you!

Quick q - why did you wrap text in div? <div> <p> text </p> </div> Thanks Natalie

Thank you!

Your code is so good - thank you! I have a question for you; do you ever use the following for layout or would you use approach given above? display: -webkit-flex;

Hi all - Best way to accomplish was what I figured out after tinkering with this - .row-1,.row-2 { display: -webkit-flex; } .box-1, .box-2, .box-3, .box-4, .box-5{ padding: 10px 10px 10px 10px }

Hi - I have two rows of elements 2 boxes on first row 3 boxes of second row in each box is an image, link underneath and then text underneath that where all 3 elements are grouped as a div. How do I get the image, link and text to align .. i am only getting link to expand to size of image by using padding, but its not perfect. I want them to match exactly. the problem is I am already setting width to a percentage in .box 1-5 level because I am floating the elements and need those floated and centered. Any help appreciated! <div class="row-1"> <div class="box-1"> <p> <img class="img-row-1" src="Residents1.jpg" /> </p> <p> <a class="link-row-1" href="Residents.html">RESIDENTS</a> </p> <p> text </p> </div> <div class="box-2"> <p> <img class="img-row-1" src="Businesses1.jpg" /> </p> <p><a class="link-row-1" href="Businesses.html">BUSINESSES</a> </p> <p> text </p> </div> </div> <div class="row-2"> <div class= "box-3"> <p> <img class="img-row-2" src="Governing-cropped-1024x688.jpg" /> </p> <p><a class="link-row-2" href="Businesses.html">GOVERNING</a> </p> <p> text </p> </div> <div class= "box-4"> <p> <img class="img-row-2" src="Recreating-1024x683.jpg" /> </p> <p><a class="link-row-2" href="Businesses.html">RECREATING</a> </p> <p> text </p> </div> <div class= "box-5"> <p> <img class="img-row-2" src="Getting-Around.jpg" /> </p> <p> <a class="link-row-2" href="Businesses.html">GETTING AROUND</a> </p> <p> text </p> </div> </div>

Hi - but if I just call out P in the CSS sheet, it will change all Ps, correct? Which is why I need a class?

Consider box 1. I have an image, a link button, and text that should all be grouped together, so I have called this <div box1>. .box1,.box2{ float: left; width: 50%; In order to size the text within this div, I think I need to put a class on it and call out its width separate from its parent since parent already has a width of 50%?

Thanks.

Hello - Trying to confirm if I can use <br/> this way, meaning is it best practice. I have text like below, which is under an image in the website. One thing that sets Mountain Village apart – <br/>and keeps us at number one on Trip Advisor – is <br/> our gondola system. We provide this <br/>form of transportation to the public for free. Yes, free. <br/> If you prefer to navigate through Mountain Village by <br/>car, you have a number of places to park within town limits, <br/> though we do recommend you retire those <br/>car keys most days. You can look at this website below and see the content under each of the 5 images. I am trying to achieve this wrapping effect with <br/> or is there a better way to do this? https://townofmountainvillage.com/

OK, I see. Thanks for your knowledge. Is there a way then to achieve the 2 rows with 2 boxes in first row and 3 boxes on second row. I have the grouping of img, text, and link achieved through divs already. Its just the overall layout that I am struggling with. Thanks.