html

  1. F

    How to diplay two <span> inline?

    <div class="wrap-input100 validate-input mr-3"> <input type="text" name="title" class="input100 text1" autocomplete="off" required> <span class="focus-input100" data-placeholder="Title"></span> <span class="count1 text-secondary"></span> </div> I need to display both span inline...
  2. H

    Form inputs in modal not showing as required

    I've read through some related articles without any luck of solving my own issue of getting form fields to appear as required. Perhaps the problem lies outside but I wanted to share in case it highlights a unique case. This is a class assignment viewable in entirety here, it allows the user to...
  3. E

    Align checkbox inside a card

    I'm using materializecss, and i'm trying to align a checkbox into a card: <div id="email-list" class="col s10 m8 l8 card-panel z-depth-1"> <ul class="collection"> <li class="collection-item avatar email-unread"> <input type="checkbox" /> <div class="mail-card-el">...
  4. M

    Change the inner HTML with another HTML code block of a div and a script

    I have been struggling with this so hopefully someone can help! So I am looking to change the inner html of a paragraph to another html element containing a div and script when my frame receives a message from the page code. I have this working only for when the inner html is set to replace with...
  5. E

    How to rearrange divs for single page application

    I'm building a single-page web app. In this one file, I want a specific div to be shown on startup. Perhaps the user will then press a button, and a new div will replace it. Right now, I'm using js to hide one div and show another in this case. The problem is, the new div appears further down...
  6. W

    Remove top/bottom padding from H (heading) tags

    I've seen lots of posts trying to address this but my padding persists. How (if possible) can you remove the top/bottom padding/margin to to your H1, H2, H3 tags etc. h1 { outline: 1px solid red; padding: 0px; margin: 0px; } <h1>hello world</h1>
  7. T

    React - Deselecting the checkbox doesn't make div to dissapear

    I'm currently messing around with Reactjs and don't know where exactly my problem lays. I wan't to render an input field if a certain chekbox is selected (requiredRoleResponsible in this case). If i check it first time to true it works fine, but if I deselect it, it won't disappear. Maybe i...
  8. W

    Image behind class not aligning properly

    I have six responsive boxes with class name A, when i try to put an image behind it inside the div class pic it does not fit to exact behind the 6 boxes. The image slightly to leftside projected. How to make it exactly behind the boxes? I have tried but not able to remove the portion...
  9. A

    Background-image with a text

    My goal is to get a result like this: For now, I would like the text to be in the background image. I think my problem is perhaps in my blocks HTML ? Here is an overview .background_grey { height: 70px; width: 100%; margin-top: 0px; position: relative; } .page_title {...
  10. F

    Changing placeholder content not working as expected

    I have a placeholder in a page but am having trouble replacing the text with CSS. The input color, size, and font-style changes, but not the content? How can I replace the placeholder content? input::placeholder { color: black; font-style: italic; content:"This isn't changing"; } <input...
  11. M

    Set border of last element of a table based on background

    I have a table which simply displays key-value pairs. The HTML code for the same is: <div class="kvp-data-table"> <div class="table-container" *ngFor="let keyValuePair of keyValuePairs; let i = index"> <div class="key-value-container" fxFlex fxLayout="row"> <div...
  12. M

    How to create horizontal scroll using css flexbox?

    I would like to create a webpage with a section that scrolls horizontally using flexbox. However, the code results in each box being reduced in size to fit the screen, rather than overflowing and enabling for horizontal scrolling. Code: .main { flex-direction: row; -webkit-flex-direction...
  13. K

    Last Items Won't Absolute Position

    I have been teaching myself HTML/CSS and realized CSS positioning has stumped me. I made myself a basic exercise to play around with and help me understand. (It is containing 4 sections, labeled 1-4.) I can get sections 1-3 to absolute position themselves to the top of the relative container...
  14. N

    How can I make my container to go down automatically of the page

    How can I make my container to go down automatically of the page if it exceed the width of the page? The page background is in black if you look at the jsfiddle and it's size is 780px. All two credit cards are displaying over the page. Thanks. My CSS as below: <div class="container"> <div...
  15. M

    Why can't I change the background of my canvas?

    So, I want to make a snake game as a beginner project to get myself into game-making, which is the main reason why I want to code in the first place. I made my canvas and, after a while, I got it to show up with the border. However, the background of my canvas won't change and I'm not sure why...
  16. B

    How do I pass button state and variable onto another page in wordpress?

    I've created a wordpress site, and have 4 buttons displaying different $ amounts. I want to save which of those buttons gets selected. When I click the submit button, I want it to use that number. <h2>Amount </h2> <a href="#" role="button"> $51.00...
  17. J

    Tooltip hidden inside parent element

    I am using a tooltip plugin. On this page (https://www.audion.com/product/speedpack-standard/#toggle-id-2) you see available options -> foot pedal. This one is hoverable and you get tooltip but it needs to overlap the accordeon because now it is hiding in it. How can I fix it?
  18. S

    Aligning embedded chat and stream together with css

    I'm trying to embed a chat along with my twitch stream on a Xenforo (forum software) page. I want the stream to be 16:9 so it's HD, and I want it to adjust based on the user's resolution. Here's what I have so far to do that <style> .twitch {I position: left; padding-bottom...
  19. M

    Switching between font awesome icons

    I'm trying to switch between icons using the unicode. I'm not sure what i'm doing wrong, I've tried switching using their className instead, that didn't work for me either, any answers are appreciated. (I would like to use vanilla javascript only no jquery) const burger =...
  20. P

    What is the idea behind setting the attributes twice, once in html and then in jquery?

    I am new to javascript and jquery and i was looking at some code and found this to be very prevalent everywhere. <ul class="items"> <li class="item" aria-controls="item-0" role="tab"> </li> <li class="item" aria-controls="item-1" role="tab"> </li> <li class="item" aria-controls="item-2"...
Top