Issue I am trying to achieve something similar to this An interesting Javascript task Ive attempted the answers but the line doesnt seem to be showing up. What i am truly trying to achieve There are lines between the grid boxes, horizontally and vertically. This is what my code looks like HTML <section class=”block-map”> <div […]
Issue The below reproducible code works fine for dragging elements from one panel to another, and in the “Drag to” panel automatically, using HTML/CSS, rank order numbering each element dragged in. However, I’m now trying to append to the end of each “Drag to” list element (using some form of paste0(…) I assume) the alphabetic […]
Issue I am new to coding and trying to figure out how to use HTML, CSS and media queries together, to create a 3 item menu of equal containers side by side in desktop view. In tablet view the menu items shift to 2 menu items staying on the first row and the 3rd menu […]
Issue I have an SVG and i’m trying to do 2 things. I wanted to center it in the .left div, i tried to use: Display:flex; Justify-content: center; Align-items: center; text-align: center; display: block; margin: auto; none of them worked for me in this case. besides that, i’m also trying to resize it when it […]
Issue What would be the best way to display a verification badge after someones username on a website with the use of jquery, javascript, php, html, css. I can echo the badge with an isset($user[verification]) But I think code and server technically this is not the best idea since the code needs to be after […]
Issue I have this div: <div class=”sh-continer-fluid bg-blue”><div> I want to style 25% of this div to blue color and 75% of div to white color. so, I am doing it using CSS: .bg-blue { background-color: #5366ea; background: linear-gradient(90deg, #FFC0CB 25%, #00FFFF 75%); } But it’s showing me floating gradient color. I need solid gradient […]
Issue So i want to create some icon and therefor the following (striped) css .css_circle { background: #8a8f97; border: 0px none transparent; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; behavior: url(../js/PIE.htc); text-align: center; text-decoration: inherit; color: #FFF; } .genic { display: inline-block; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; line-height: 1; font-family: ‘Genericons’; text-decoration: inherit; font-weight: normal; font-style: normal; […]
Issue I was experimenting CSS3 @keyframes animations but I didn’t managed to make it work in Chrome (currently I have Chrome 38) The code is really simple : HTML <div id=”block”>moving text</div> CSS @keyframes mymove { 0% {top:0px;} 25% {top:200px;} 50% {top:100px;} 75% {top:200px;} 100% {top:0px;} } #block { position:absolute; animation: mymove 2s infinite; } […]
Issue I’m trying to align an image next to some text on my webpage without using any position properties like right:, left:, top:, and bottom: but I just can’t align it the way I want body { background-color: #fafafa; font-family: Epilogeal, sans-serif; } .main { padding: 20px; overflow: hidden; } nav { width: 100%; position: […]
Issue in my form I have three input fields name, email, mobile but I want to change input text box like ‚Äì name : _____________ email: _____________ mob : _____________ Solution In your CSS: input[type=text] { background: transparent; border: none; border-bottom: 1px solid #000000; } From here you can play with padding to position the […]