Skip to content
OverviewSolutions
17
Comments
6

Ajayi Michael

@Michaelajayi150Nigeria400 points

Web developer - HTML, CSS, JavaScript, ReactJs.... Available for any project

Latest solutions

View more solutions

Latest comments

  • Ajayi Michael•400
    @Michaelajayi150

    @adetoye-dev - Implement the map display and also make the site fetch domains as well... Your CSS as well needs adjustments

    For the map read the Leaflet quick guide This should properly help you in setting the map to display and also add your marker.

    The background image of the header is not covering the whole page.. You should probably check that out as well

    Hope this helped....

  • Mahdi Rezaei•500
    @MahdiRezaeiDev

    Todo-app

    #accessibility#itcss#sass/scss#vite#webpack
    1
    Ajayi Michael•400
    @Michaelajayi150

    Nice app... Love the work done here You could possibly fix your HTML issues though...

    • Try use data attributes for your color-scheme Instead of
    <html color-scheme="light" lang="en">

    Do this

    <html data-color-scheme="light" lang="en">

    then change the CSS to:

    [data-color-scheme="light"] {
    /* whatever light mode does */
}

[data-color-scheme="dark"] {
    /* whatever dark mode does */
}
    • The properties that you are using such as inset are not valid CSS properties... Check out Tutorial Republic to get the particular property you are looking for

    Hope this helped... If it did, kindly mark as useful 🙃

    Marked as helpful
  • Ajayi Michael•400
    @Michaelajayi150

    Hi there @Pranshu-Sahu.... Concerning your accessibility issues

    • There must be an "h1" tag in your project... Headers tags are not just for font customization only, they serve greater purpose to screen readers... I'd advice your text "TODO" place it in an h1 tag
    <h1 class="heading-tag">TODO</h1>

    then style it to fit the font size and weight you want

    .heading-tag {
   font-size: blah blah
   font-weight: blah blah blah
}
    • Organize your div's properly into main tags, header tags and footer tags... The order must be:
    <body>
    <header>
        All other elements/tags must be a sub element of either of this three element
    </header>
    <main>
        All other elements/tags must be a sub element of either of this three element
    </main>
    <footer>
        All other elements/tags must be a sub element of either of this three element
    </footer>
</body>

    Then the HTML issue...

    • Remove the role attribute you placed in the img tag, role is not needed as soon as you have an alt attribute already
        <img src="blah blah" alt="description of blah blah" />

    Glad to help 😊 Kindly mark if this was helpful to you 🤗

  • Ajayi Michael•400
    @Michaelajayi150

    Having an HTML issue here... I don't have a type attribute in my link tag when importing LessCSS from their CDN and the report still claim that I still do whereby it has been removed.... Any one with idea of how to resolve this please

  • Bit•140
    @bit-01

    Todo App

    #firebase#vue#bootstrap
    1
    Ajayi Michael•400
    @Michaelajayi150

    Hi, awesome work on this 👍 You do have an accessibility issue though, I suggest you add a label for your input place it over the input field and make it visibility - hidden and opacity - 0

    Hope this helped 😊

    Marked as helpful
  • Ajayi Michael•400
    @Michaelajayi150

    Nice work... You should probably check the report for accessibility and HTML5 issues

    There are some issue on the semantics used.... Glad I could help

    Marked as helpful