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>
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 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>
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 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 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 8 years ago.
Improve this question
I'm trying to get this to work, I found this.
Instead of 4 columns, I want to keep the same height for 3 columns. How can I do this?
This is how it looks on my frontend:
x http://imagizer.imageshack.us/v2/150x100q90/661/TS8KVU.png
And it should be at 100% of the screen side by side images.
like this? or you want the image fill the div?:
<div class="col-md-4 no-pad">
<img class="img-responsive" src="//placehold.it/1280x640/eee">
</div>
<div class="col-md-4 no-pad">
<img class="img-responsive" src="//placehold.it/1280x640/eee">
</div>
<div class="col-md-4 no-pad">
<img class="img-responsive" src="//placehold.it/1280x640/eee">
</div>
.no-pad{
padding-left:0px;
padding-right:0px;
height:381px;
}
.no-pad img{
width:100%;
height:100%;
}
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Closed 9 years ago.
Improve this question
I have 4 images which are links, I want to create a border but instead of creating it around each image (which automatically CSS does) I want to create it around the 4 images as a whole.
Place the images in a div and then make the border on the div
something like this:
<style>
.image-div{
border:1px #000;
}
</style>
<div class="image-div">
<img src="">
<img src="">
<img src="">
<img src="">
</div>
Check this JSFiddle: http://jsfiddle.net/RXmb9/4/
Wrap your images in a span or a div and then apply the border.
CSS
.cool { border:1px solid red; }
img { width:50px; height:50px; }
.one { /* Apply specific borders for images if you want */ }
HTML
<div class="cool">
<img src="" class="one" />
<img src="" class="two" />
<img src="" class="three" />
<img src="" class="four" />
</div>