Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 10 months ago.
Improve this question
I am making a site and want a fosted glass effect, any help is welcome, I have tried blur and other things but am struggligng
the html to aply it to is
<div class="frostedhere">
<p> this is in the box</p>
</div>
You could try using background-image:and adding an image of some frosted ice. If you want to add it overtop, add the image then make a z-index of 2, and change the opacity to maybe 0.5.
.frostedhere{
background-image(url"image location or url here");
z-index:2;
opacity: 0.5;
}
.frostedhere{
background-image:url("https://previews.123rf.com/images/miramiska/miramiska1606/miramiska160600143/58708185-gel-de-glace-d-hiver-fond-gel%C3%A9-texture-de-verre-de-fen%C3%AAtre-d%C3%A9poli-fond-froid-de-gla%C3%A7ons-frais-sc%C3%A8ne-.jpg");
z-index:2;
opacity: 0.4;
padding: 50px;
}
<div class = "frostedhere">
<p> placeholder </p>
</div>
here is a codepen to it
https://codepen.io/Person2356/pen/ZEvZMKE?editors=1100
the divs with the container and card are what will make it work
html
<body>
<div class="container">
<div class="card">
<p><b>hello people </b></p>
</div>
</div>
Related
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 1 year ago.
Improve this question
How can I style this into a clickable image link ?
<h1 class="logo">
<a class="logo__link" href="main.html">
<img class="logo__img" src="Image/Logo_1.PNG" alt="logo">
</a>
</h1>
Using the same code you have provided, I added a few css to make the a cover the image, as well as setting a width to the img so that it will be contained in the a.
img {
max-width: 200px;
}
.logo__link {
display: inline-block;
}
<h1 class="logo">
<a class="logo__link" href="main.html">
<img class="logo__img" src="https://www.logo.bot/blog/wp-content/uploads/2021/04/Untitled-3-26-1.png" alt="logo">
</a>
</h1>
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 3 years ago.
Improve this question
There is block:
<div class="container-fluid">
<div class="body_wrapper">
</div>
</div>
How to show block .body_wrapper by 100% of content with margin from body borders?
Add some content and use width: 100% in body_wrapper css
.body_wrapper {
width: 100%;
background-color: blue;
}
<div class="container-fluid">
<div class="body_wrapper">
Content
</div>
</div>
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 6 years ago.
Improve this question
How to delete the area under the navbar? I used the "margin-bottom: 0" and it's not working correctly.
just add .container class to your .wide div
<div class="wide container">
<h1>test</h1>
</div>
https://jsfiddle.net/grassog/1b0m6ztx/
use clearfix class with wide or just add overflow: hidden; in .wide to set h1 margin
<div class="wide clearfix">
<h1>test</h1>
</div>
or
.wide {
overflow: hidden;
}
Wrap all the content inside wide div with <div class="container"></div> to keep full width background image as it is in your screenshot.
<div class="wide">
<div class="container">
<h1>test</h1>
</div>
</div>
JSFiddle example
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 7 years ago.
Improve this question
How can you remove white space between divs nested within each other. For example
<div>
<div>
</div>
</div>
Could you specify which space are you referring to with reference to the below link
http://jsfiddle.net/meghanagpal/4khuL01a/1/
HTML
<div class="default"></div>
<div class="default"></div>
CSS
.default{
height:100px;
width:100px;
border:1px solid red;
}
Add this CSS to your code
div{
margin: 0;
}
or add inline CSS to your div like this
<div style="margin:0"></div>
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
I am trying to create a footer page - but I am abit stuck...! I want to have in-line text as shown on this link:
http://postimg.org/image/6cyb2y2mx/
The copyright on the left and the links on the right. Can someone guide me how to achieve this? My working progress is here: jsfiddle.net/5GRpH/5/
Thank you.
You can use float:left; and float:right; after the floated the elements, you should do a clear:both to make sure the footer height is reset.
HTML
<div>
<div class="left">copy 2013</div>
<div class="right">sitemap | contact</div>
<div class="clear"></div>
</div>
CSS
.right{
float:right;
}
.left{
float:left;
}
.clear{
clear:both;
}
See here on jsfiddle: http://jsfiddle.net/5GRpH/6/