I have implemented a horizontal carousel at the bottom of my website www.woody.my. The carousel functions properly in Chrome, but is not visible in Firefox, Opera, and IE.
Here is how it appears in Chrome:
And this is how it looks in Firefox:
I have implemented a horizontal carousel at the bottom of my website www.woody.my. The carousel functions properly in Chrome, but is not visible in Firefox, Opera, and IE.
Here is how it appears in Chrome:
And this is how it looks in Firefox:
This content is written in HTML
<ul style="width: 1000px;">
And this content specifically relates to line 526 in the CSS file
.infiniteCarousel ul li {
background: url("../images/footer_img_box.png") no-repeat scroll 0 0 transparent;
display: block;
float: left;
height: 220px;
padding: 10px;
position: relative;
width: 198px;
}
.infiniteCarousel .wrapper ul {
width: 900px;
list-style-image: none;
list-style-position: outside;
list-style-type: none;
padding: 0;
top: 0;
}
Although the <li> elements are positioned absolutely, they appear stacked on top of each other. To fix this, the position needs to be changed to relative. Additionally, the main container had an excessively large size of 9999px, which should be changed to fit within the viewport so that floated elements can be visible next to each other.
It is also recommended to remove the positioning from the .infiniteCarousel .wrapper ul class
give this a shot
.neverEndingCarousel ul li {
background: url("../images/footer_img_box.png") no-repeat scroll 0 0 transparent;
display: block;
float: left;
height: 220px;
padding: 10px;
position: absolute;
width: 198px;
}
ps I'm also located in Malaysia :)
I'm having trouble customizing the navigation bar using .navbar and #navbar in CSS. I was hoping to make changes to the Bootstrap navbar, but nothing seems to be working. I'm not sure if it's an issue with the HTML or CSS. I've include ...
I'm having an issue with the color input There seems to be a gap between the black border and the actual color, but I want to get rid of it #color-picker { border: 5px solid black; border-radius: 5px; width: 207px; height: 60px; padding: ...
I have an SVG file containing two different paths. <path d="M 84.4 53.2 C 75.3 50.1 67.1 48.5 59.6 48.3 C 51.2 48 45.2 47.5 41.5 46.5 C 35.7 45.1 29.9 42.4 23.9 38.4 C 21.6 36.9 19.4 35.2 17.3 33.2 C 19.4 34.2 21.6 35 23.9 35.6 C 27.3 36.5 34.1 37 44 ...
I am currently working on an application that involves a collection of cards. My tech stack includes React and MUI v5. One issue I've been facing is with the grid layout, specifically in trying to keep the image size consistent within the grid item. ...
Struggling with customizing my JavaFX application using CSS. Everything was going smoothly until I encountered the Datepicker. Despite trying various approaches, none seem to be working. Is there a way to round the Datepicker just like my TextFields? Here ...
Below is a Rails code snippet for input fields. Name:-<%=text_field_tag "specification[name1]","",:class=>"autocomplete form-control"%> <br/> Value:-<%=text_field_tag "specification[value1]","",:class=>"autocomplete form-control"%> ...
I am currently working on a code to automate joining a google meet. The process involves signing into my google account, which is successful until I reach the "Verify that it's you" stage (image 1). When I attempt to use driver.get, it redirects me ba ...
I am currently working on creating a full-screen menu that functions like a modal. Everything seems to be working fine, except for the fadeOut animation. Can someone please help me understand what is causing issues with my scripts/codes? I want the content ...
Setting up my index page has been more challenging than I anticipated. Take a look at my browser: https://i.stack.imgur.com/L4b6o.png Here is the index page I'm struggling with: https://i.stack.imgur.com/Op6lG.png I am completely stumped this tim ...
I'm working on a list where SVGs are loaded as list items. How can I adjust the height and width of the ::before pseudo-element to be 30px x 30px? Setting the height and width directly didn't work for me. Can someone assist with this? <div cl ...
Utilizing Python libraries cherrypy and Jinja, my web pages are being served by two Python files: Main.py (responsible for handling web pages) and search.py (containing server-side functions). I have implemented a dynamic dropdown list using JavaScript w ...
I am currently in the process of creating a brand new website using TYPO3 6.2 and incorporating the Bootstrap Package. My goal is to be able to assign custom CSS classes to menu links directly from the backend, and then display these CSS classes within my ...
Currently, I am in the process of learning how to create my own database with the help of tutorials and resources like Stack Overflow. I have successfully created a register page where users can enter their username and password to access the upload page. ...
I have just initialized a new DOM XPATH OBJECT. After performing several operations, I saved my result using SaveHtml $String[] = $dom->saveHTML(); Next, I placed the content into a file. file_put_contents($filename, $string); The HTML Structure l ...
I'm currently developing a resume builder app using ReactJS. One of the functionalities I'm working on is enabling users to download their resumes as PDFs. However, I've encountered an issue with the generated PDFs when using jsPDF. The down ...
Within my datagrid, there exists an expandable/collapsible section above the content (see Picture 1 https://i.sstatic.net/N68Rl.png). Upon expanding the content, a scroll bar appears within the datagrid element to display the data (see Picture 2 https://i. ...
I'm working on a React.js app with Typescript and I need to remove the default visited Material Icons coloring from an anchor tag. Here's the stylesheet I tried: const useStyles = makeStyles((theme: Theme) => createStyles( myAnchor: ...
I'm currently working on implementing raycasting in typescript with HTML Canvas 2D based on the tutorial from this video: https://youtu.be/TOEi6T2mtHo. However, I've encountered an issue where the rays being cast consistently point in a single di ...
I am facing a simple problem with my handlers for /login get and post requests. Here is the code: loginRender(req, res) { let options = { title: 'Login', layout: 'auth.hbs' } res.render('login', options) } logi ...
Hey everyone I have a question: Is there a CSS trick to style the red border (or shadow) of input fields that have not been validated, such as email inputs? If my explanation isn't clear enough, I'm referring to changing the color of this eleme ...