I'm struggling to align my footer navigation inline with my footer title. Check out this code snippet to see what I've tried so far: https://jsfiddle.net/nkzsufov/
I experimented with using absolute and relative positioning:
.footerNav {
margin-top: 35px;
font-size: 1.5em;
font-family: Oswald;
float: left;
position: absolute;
}
I also applied float: left; to both the footerNav and footerNav li.
What am I missing? Any suggestions?
#footer_menu ul {
/* margin: 0px 30px; */
padding: 10px 30px;
list-style-type: none;
text-decoration: none;
display: inline;
}
#footer_menu ul li {
margin: 0 0;
padding: 5px 0;
display: inline-block;
color: white;
clear: both;
}
Hopefully, this solution will do the trick.
I made some adjustments to two CSS classes in your JSFiddle and it looks like I was able to achieve the desired outcome. By simply adding 'float:left' and removing the 'position' attribute, the layout now appears as intended.
.footerTitle {
font-size: 2.2em;
font-family: Oswald;
font-weight: bold;
margin-top: 33px;
float:left;
}
.footerNav {
margin-top: 35px;
font-size: 1.5em;
font-family: Oswald;
float: left;
}
I need help figuring out how to save product and price information to local storage when an "add to cart" button is pressed. Can someone provide guidance on how to do this? Here is the code I currently have: body> <!-- Header--> ...
I need assistance with adding a selector on my webpage where users can choose one option and retrieve the id of the selected part. This id will then be used in a link. I am new to using jQuery, so I am having trouble implementing this feature. Below is an ...
Is there a way to restrict an HTML input field to only accept numbers and email IDs? <input id="input" type="text" /> ...
I encountered an issue with my code, where I successfully created a <th> element initially, but faced problems when trying to create it repeatedly. function createTH(){ var noOfRow = document.getElementById("addItemTable").rows.length; var t ...
I recently implemented a month and year date picker code I found on a website. While I was able to customize the date format (mm/dd/yy) and successfully select values, I encountered an issue where the selected date changes drastically when clicking away fr ...
After setting up an MVC Core App with automatic scaffolding, I am now faced with the challenge of adjusting the font size in my html View. The question is: How can I change the font size in bootstrap.css? There seem to be multiple font sizes available an ...
I am currently working on a navigation menu that includes various subjects. One of the subjects is titled Equipment, and when I hover over it, Throwables and Gear appear. However, I now want to add another dropdown menu that opens when I hover over Throwab ...
Currently, I am extracting values from a table using JavaScript. The code seems to be functioning correctly, but I am looking for ways to optimize it and ensure that it is compatible with most modern browsers. The list in the table undergoes frequent chang ...
Using Bootstrap 4 and jQuery 2.2.4, I've created a navbar with three layers of menus, comprising two levels of drop-downs from the top-most level. Everything works smoothly except for a glitch on mobile devices. The menu collapses to the hamburger ic ...
I am currently using a script to send emails that result in a couple of HTML tables: $from = "example.com <<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="82efebe7ef83898ce0ede1e9e3e6d2edeee8">[email protected]</a ...
Below is the form content <form method="post"> <input type="hidden" name="resulttype" value="Create"> <table> <tr> <td>Full Name</td> <td><input ...
I have encountered this situation multiple times, but unfortunately, I have not been able to find a simple solution or a website that explains the process and reasoning behind it. My goal is to create a container (div) that includes both a loading element ...
I am facing an issue with the following code snippet: * { box-sizing: border-box; } .wrapper { position: relative; /* border:1px solid blue; */ width: 250px; } .text { position: absolute; border:1px solid red; bottom: 0px; ...
Is it possible to generate HTML and SVG code based on the position of a Subscriber on a web page or within a specific div? I would like to provide some JavaScript code that can be inserted inside a particular div on the page. Using an iframe is not ideal ...
I have been delving into learning React by challenging myself with a React problem. The code challenge I'm facing involves trying to close a drop-down when clicking outside of it. Despite my efforts to debug, I haven't had much luck in solving th ...
Issue Description: I encountered an issue while working with typescript and emotion/styled libraries. When attempting to specify the type of the parent component that wraps a styled component, I faced difficulties. The scenario involves a parent componen ...
<li class="megamenu-content"> <div class="megamenu-content-wrapper clearfix"> <ul class="col-lg-3 col-sm-3 col-md-3 "> <li class="cat-header">DISPLAY MEMBERS</li> ...
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Tit ...
I am currently working on a website using Bootstrap 3 framework. I have a specific section where I need to have two fluid containers placed side by side, each with different background colors. One of these containers should also include a background image ...
I am currently developing a React application and facing an issue with my SCSS files. I have three SCSS files, one main file that contains theme variable colors, and the other two are located in component folders. When I import the main SCSS file into the ...