Help needed with Tabs and Sub Tabs Creation

Hi Everyone,
I'm new to Web site Page Design Just learning I have Web site https://www.fashionfore.com
This is an HTML Bootstrap Css Corrections for to alter the Tabs or Menu Font size and to Add Drop down Menu in the Skill Development Menu

<li class="nav-item-child active margin dropdown ">
                            <a class="nav-link dropdown-toggle" href="#" id="dropdown-a" data-toggle="dropdown">Skill Development</a>
                            <div class="dropdown-menu" aria-labelledby="dropdown-a">
                                <a class="dropdown-item" href="services.html">Product Sourcing</a>
                                <a class="dropdown-item" href="services.html">Artificial Intelligence</a>                          
                            </div>
                        </li>

Code (markup):

It is now working but I need to fix the alignment of the submenu or the drop-down
at the same time, I need to alter the Font of the Tabs and the Content font size with the CSS Files Can Anyone help me on this pls... where to correct it in the CSS Files
I need to align this Dropdown

 

Since I don't see a dropdown occurring on your page, I'm not sure what you're even talking about; but even this tiny snipped reeks of why the first thing you need to do is pitch the train wreck laundry-list of how NOT to build a website that is bootcrap in the trash, STOP wasting your time learning it, and STOP believing the BALD FACED LIES over how "easy" it makes things.

As evidenced by train wrecks of markup like this:

        <header class="header">
            <!-- Navbar -->
            <nav class="navbar" role="navigation">
                <div class="container">
                    <!-- Brand and toggle get grouped for better mobile display -->
                    <div class="menu-container">
                        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".nav-collapse">
                            <span class="sr-only">Toggle navigation</span>
                            <span class="toggle-icon"></span>
                        </button>

                        <!-- Logo -->
                        <div class="navbar-logo">
                            <a class="navbar-logo-wrap" href="index.html">
                                <img class="navbar-logo-img" src="img/logo.png" alt="Fashionfore">
                            </a>
                        </div>
                        <!-- End Logo -->
                    </div>

                    <!-- Collect the nav links, forms, and other content for toggling -->
                    <div class="collapse navbar-collapse nav-collapse">
                        <div class="menu-container">
                            <ul class="navbar-nav navbar-nav-right">
                                <!-- Home -->
                                <li class="nav-item">
                                    <a class="nav-item-child" href="index.html">
                                        Home
                                    </a>
                                </li>
                                <!-- End Home -->

                                
                                <!-- About -->
                                <li class="nav-item">
                                    <a class="nav-item-child" href="aboutus.html">
                                        About US 
                                    </a>
                                </li>
                                <!-- End About -->
                                <!-- About -->
                                <li class="nav-item">
                                    <a class="nav-item-child" href="service.html">
                                        Services
                                    </a>
                                </li>
                                <!-- End About -->
                                
                                <!-- Skill Enhancement -->
                                <li class="nav-item">
                                    <a class="nav-item-child" href="skill-enhancement.html">
                                        Skill Development
                                    </a>
                                </li>
                                <!-- End Skill Enhancement -->

                                <!-- Store -->
                                <li class="nav-item">
                                    <a class="nav-item-child" href="onlinestore.html">
                                        Store
                                    </a>
                                </li>
                                <!-- End Store -->

                                <!-- Contact -->
                                <li class="nav-item">
                                    <a class="nav-item-child" href="contact.html">
                                        Contact
                                    </a>
                                </li>
                                <!-- End Contact -->
                                <!-- Blog -->
                                <li class="nav-item">
                                    <a class="nav-item-child" href="fashionforeblog.html">
                                        Blog
                                    </a>
                                </li>
                                <!-- End Blog -->
                            </ul>
                        </div>
                    </div>
                    <!-- End Navbar Collapse -->
                </div>
            </nav>
            <!-- Navbar -->
        </header>

Code (markup):

doing the job of this:

<header>
	<h1>
		<a href="/">
			FasionFore
			<span>-</span>
			<small>Fashion Forward</small>
		</a>
	</h1>
	<input type="checkbox" id="toggle_mainMenu" class="toggle" hidden>
	<label for="toggle_mainMenu"></label>
	<nav id="mainMenu">
		<ul>
			<li><a href="index.html">Home</a></li>
			<li><a href="aboutus.html">About US</a></li>
			<li><a href="service.html">Services</a></li>
			<li><a href="skill-enhancement.html">Skill Development</a></li>
			<li><a href="onlinestore.html">Store</a></li>
			<li><a href="contact.html">Contact</a></li>
			<li><a href="fashionforeblog.html">Blog</a></li>
		</ul>
	</nav>
</header>

Code (markup):

Again just more proof that the know nothings who CREATED bootcrap aren't qualified to flap their yap on the subject of writing HTML or CSS, and every last person SUCKERED by this idiocy should probably be looking into some form of litigation for recompense.

It has you vomiting up 31k of markup for 4.2k of plaintext and a dozen content images, not even 10k of HTML's flipping job... it has you wasting time learning or blindly copying all it's derpy presentational classes in violation of the reason and intent of the separation of HTML from CSS, and by the time you get all their scriptttardery doing CSS' job, scripttardery doing HTML's job, endless pointless presentational classes, endless pointless DIV for nothing, broken layout mentality, and just plain halfwitted approach to doing much of everything, every codebase trampled on by this idiocy is reduced to ruins that any competent person should shudder in horror at.

They sucker nube and rube alike with their propaganda wrapped lies, with not a single claim made about it holding up under the slightest scrutiny.

But tell me again how much "easier" it is.

My advice? Throw that entire mess and start over without some dipshit framework. Then you might actually learn enough to develop mind-numbingly simple pages like this faster, easier, and not needing to come running for help over something as mundane as a dropdown.

Some tips? Pissing all over the markup with more classes is NOT the answer. Using a DIV with anchors blindly tossed in it instead of the proper semantics of a nested UL/LI is NOT the answer.