Hey, I'm trying to figure out how to create something similar to the image shown in this picture:
I attempted using Bootstrap grid but I keep ending up with a border around the edges. Any suggestions?
Hey, I'm trying to figure out how to create something similar to the image shown in this picture:
I attempted using Bootstrap grid but I keep ending up with a border around the edges. Any suggestions?
.custom-image {
position: relative;
display: inline-block;
width: 200px;
text-decoration: none;
color: #000;
box-shadow: 0 0 20px 0 rgba(0,0,0,.2);
margin: 20px;
transition: box-shadow .3s ease-in-out;
will-change: box-shadow;
}
.custom-image:hover {
box-shadow: 0 0 4px 0 rgba(0,0,0,.2);
}
.custom-image figure {
margin: 0;
}
.custom-image figure img {
width: 100%;
}
.custom-image figcaption {
padding: 15px;
}
.custom-image figcaption .date {
font-size: 12px;
color: #999;
}
.custom-image figcaption .message {
font-size: 16px;
}
.custom-image figcaption .message p {
margin: 0;
}
.custom-image footer {
background-color: purple;
color: #FFF;
font-size: 14px;
}
.custom-image footer p {
margin: 0;
padding: 7px 15px;
}
<a href="#" class="custom-image">
<figure>
<img src="https://static.pexels.com/photos/324658/pexels-photo-324658.jpeg">
</figure>
<figcaption>
<span class="date">4/07/2017</span>
<div class="message">
<p>Lorem ipsum dolor sit amer</p>
</div>
</figcaption>
<footer>
<p>Read more</p>
</footer>
</a>
I have created a game using Phaser, a JavaScript library for games. Now I am looking to implement a score table using JS/PHP. My main focus is on transferring a variable from JS to PHP in order to update the database. I have researched numerous topics and ...
Table 1 orderid customerName totalCost ---------------------------------- 1 Jonh £200.00 2 Ringo £50 Table 2 orderlineid orderid productName productPrice Quantity ----------------------------------------------- ...
In my form, I have a JSON array that includes the name and value of each input. I am attempting to add an "optionprix" attribute for each input with the "optionname" class based on the corresponding value of the input with the "optionprix" class. Here is ...
I am experiencing an unusual problem in IE11 where the content at the bottom of my page is being cut off along with the scroll bar that should allow for viewing that content. I have managed to resolve this issue in Chrome, Firefox, and Edge but I cannot se ...
https://i.sstatic.net/Dbvq5.png I've been working on achieving a balanced layout and I'm looking for help. How can I create even spacing vertically between the text elements while keeping them contained within the card? Below is the HTML code s ...
I'm attempting to decode this HTML page using Node.js and the Request module: The JavaScript console shows that the charset is windows-1252: document.characterSet = "windows-1252"; I've tried all available encodings in iconv-lite, but none of ...
I have a link on my website that opens a floating window containing more links when clicked. <a href='javascript:void(0);' onclick='window.open("http://mylink.html","ZenPad","width=150, height=900");' target='ZenPad'>&l ...
I am experimenting with using ajax on dynamically generated html elements from django. I have tried selecting the instances by class, but for some reason, it is not working as expected. Can anyone point out my mistake here? javascript $(document).ready(fu ...
Running this code <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>Searc ...
Can anyone help me solve a design issue I'm facing? I have a div with three floating buttons, but one of the buttons is taller than the others due to more content. I'm looking for a way to ensure that all buttons are the same height as the talle ...
I am encountering an issue while using TinyMCE as my editor. I have added the plugin as instructed, but I cannot find the "hr" button/option in the editor interface. If anyone has any insights or solutions to this problem, please share! This is how I am ...
I recently used an online converter to transform a PDF into HTML. Check out the result here: http://www.example.com/pdf-to-html-converted-file The conversion did a decent job, but I'm wondering if it's feasible to have the content scale to 100% ...
My website is filled with videos, but I've been experiencing slow loading times on some of them. Could the resolution be the cause? Any tips on how to optimize video loading speed? What are your thoughts and experiences with html5 video settings? Whi ...
I've been struggling with resolving this issue using chat GPT for quite some time now. It keeps indicating that everything is fine, but it's clearly not working as expected. At the moment, I am focusing on fixing the email field first before proc ...
Greetings! I am currently working on developing backends in ASP.NET 2.0, and have taken steps to optimize the performance by caching images, GZIPing CSS and JS files. The load speed of each option is good, but I am eager for even faster loading times. Alt ...
<html> <body> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> <script type="text/javascript> $('img').click(function(){ var ge ...
Currently, I have a PHP array structured like this. $food = array ("Fruits" => array("apple","mango","orange"), "vegies"=> array ("capsicum", "betroot", "raddish"), "bisucuits"=>array("marygold", "britania", "goodday")); My task is to create two ...
I'm attempting to dynamically change the size and color of a circle based on user input in the form fields. However, I've encountered the following error: Cannot set properties of undefined (setting 'css') Could anyone provide guidan ...
I am having trouble with a div on my website. When I include a table in one div it resizes perfectly, but when I do the same in another div using a different template, it doesn't work as expected. To see the issue, please visit: Home page, bottom lef ...
Within my codebehind file, I have defined a CSS class. When I use the "class" attribute on normal HTML elements, the style is applied correctly. However, if I apply the class to a MudElement using the "Class" attribute, the style does not get pulled. Altho ...