Skip to content
OverviewSolutions
6
Comments
4
Lauren Delmar
@lrdelmar

All comments

  • Lauren Delmar•80
    @lrdelmarPosted 11 days ago

    To get the table with the lines between the rows and no gaps you could use

    table {
  text-align: left;
  border-collapse: collapse;
  table-layout: fixed;
  width: 100%;
}

tr {
  border-bottom: 1px solid hsl(30, 18%, 87%);
}

tr:last-child {
  border-bottom: none;
}

    I would use the <strong> element where you have used <span> which would automatically embolden the text there.

    Also pay attention to the colours and font-weights in the style-guide.

    0
  • Lauren Delmar•80
    @lrdelmarPosted 13 days ago

    The hover state for the social links are missing, they can have a blank destination if you don't want to point them anywhere specific. You created them as a list, you can easily add anchor elements to these and set :hover and :focus so that these are accessible.

    <li><a href="#">GitHub</a></li>

    li:hover, li:focus {}

    0
  • Faith Achieng•110
    @FaithAchiengSubmitted 18 days ago
    What are you most proud of, and what would you do differently next time?

    I am proud that I was able to complete this project without any assistance from my friends.

    What challenges did you encounter, and how did you overcome them?

    Adjusting the margin for the blog preview card....I overcame this problem by reading about margins and understanding it.

    What specific areas of your project would you like help with?

    Adjusting the margins. How to specify the padding for "Learning"

    Blog preview card using CSS cards

    2
    Lauren Delmar•80
    @lrdelmarPosted 18 days ago

    I would use margin when I need to add white-space below or above an element and always stick to either margin-top or margin-bottom for a project.

    For the learning tag, instead of using margin try setting a % width instead. Move the padding from ".learning" to ".learning p".

    I noticed a capital P on line 26 of your style.css which needs to be lower case. If you set the font-family to the body instead it will apply to all elements. Keep practicing and you'll get there :)

    Marked as helpful
    0
  • Eze David•10
    @7thKingDavidSubmitted 21 days ago
    What are you most proud of, and what would you do differently next time?

    Knowing how to get what i wanted using AI was amazing

    What challenges did you encounter, and how did you overcome them?

    i couldn't center bthe image at first after trying to use margin and padding but, i looked it up immediately from my copilot

    What specific areas of your project would you like help with?

    how to move images around my webpage using css

    i used display: block makes the image a block-level element.

    1
    Lauren Delmar•80
    @lrdelmarPosted 21 days ago

    Visually there are some differences, the text is not centered, the font is missing and the rounding of the image itself. I can see you have some duplicate CSS code in there for resetting the border and margins. You can use containers within containers to help you align items. You can use this to group elements together which can help you to position things where you want.

    Marked as helpful
    0