Removing the extra padding of the widget [closed] - html

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 want to decrease the extra grey area of the right hand side of the "property search" widget at the top. The website is a wordpress. Can someone help please?
The link is as follows:
http://192.254.143.28

Please add this code to your stylesheet, you just need to reduce the width of the property-search container:
.property-search-container.type1 {
width: 581px;
}

.property-search-container.type1 {
background: #f3f3f3;
display: inline-block;
width: 585px;
text-align: center;
}
Change the CSS above to change the size of the grey box.
Play around with the width property to fit your need

modified your style of this selector. and replaced width: auto.
.property-search-container.type1 {
background: #f3f3f3;
display: inline-block;
width: auto;
text-align: center;
}

You should remove width: auto; from .property-search-container.type1 .dt-sc-tabs-container that will make your white box to fit in grey box. Then decrease the size of grey box by reducing width of .property-search-container.type1

Related

html+css Error in css float boxes with image fixed width [closed]

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 2 years ago.
Improve this question
I have some images with original size 260px, i want to show 4 images per line in the container with max-width:1024px; so i set image width 100% and a div box container width:205px; and margin: 10px; and the error occures, what is wrong with the code below?
What happens:
[a print screen of the error][1]
The code is this:
https://www.appdevtools.com/pastebin/k3fxj5
in your case your should use FlexBox.
Like this:
.clearfix {
max-width:1024px;
display: flex;
justify-content: space-between:
flex-wrap: wrap;
}
.linkbox {
width: 205px;
margin: 10px;
border: 1px solid black;
}

Aligning divs inline while leaving the content top to bottom in footer [closed]

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
Sorry if this is a duplicate, but I've been looking around for the last hour and can't find any solutions that work.
I have three divs that I need to line up left to right for my footer, but the content inside the divs needs to remain top to bottom. Here's a picture of the mockup that I made:
I've tried inline-block, i've tried block, I've tried float, I've tried them all together, and a host of other stuff and I can't figure it out. They still line up top to bottom. Any help would be appreciated, here's a fiddle with all the code for the footer.
https://jsfiddle.net/kLbtfqp6/
Change your css to this:
.footer {
background-color: #5c0e13;
color: white;
display: inline-block;
width: 100%;
}
.favicon {
display: block;
}
.footernav, .socialmedia {
width:50%;
float: left;
}
.footer img {
width: 10%;
display:inline-block;
}
.footer p {
width: 50%;
display:inline-block;
}

What is blocking my pitcure in my website? HTML, CSS [closed]

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 7 years ago.
Improve this question
I want my pictures to be complete and centered but there is something blocking it, is a slider for 9 pictures and each picture has a box that holds inside the picture.
The main problem is the plantilla that holds the picture, the thing is tha I've been trying to make it bigger so the image can occupy the whole center of the page
This is part of the code that I have in my css
div.carousel .col-md-4.animation-element {
min-width: 400px !important;
margin-left: 0%;
}
.carousel-indicators {
margin-bottom: 10%;
}
.carousel .item{
margin: 0 auto;
}
and this is the Website
I've tried to change the css of bootstrap but not even that worked, I've put the configuration "margin: 0 auto;" also but nothing
.carousel-inner {
position: relative;
width: 100%;
overflow: hidden;
}
I removed the overflow: hidden; and it looks fine to me.

Trying to get slider to stay within background image border and still remain responsive [closed]

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 7 years ago.
Improve this question
I have been trying(very hard)to get this slider to remain inside the black area of the background image. I can do it if I set all the widths etc. to fixed values but
then the page is no longer responsive. When I try using percentages everything scales with the browser but the slider jumps around...Mock up is running at:
http://www.skaliwag.com.au
Hello i think i fixed your problem.
It's very simple. You just need to change two values in your css: the .rslides margin to 65% auto and remove the margin-top of the image. Then it should look like this.
The slider div:
.rslides {
position: relative;
list-style: none;
overflow: hidden;
width: 70%;
padding: 0M
margin: 65% auto;
}
and the image:
.rslides img {
float: none;
display: block;
height: auto;
width: 100%;
border: solid 1px;
border-radius: 10px;
position: relative;
}
Hope it was helpfull :)

css two divs side by side with textarea inside without using float or absolute [closed]

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 7 years ago.
Improve this question
I have 2 divs that are side by side and they have display:inline-block and they look great. I tried adding a textarea inside one of the divs, and it made it slide down so its not lined up next to the other div anymore.
This is what it looks like right now. How can I fix it?
You are pretty close. Here is the code and a link to the fiddle.
div {
width: 100px;
background: gray;
height: 200px;
display: inline-block;
vertical-align: top;
}
textarea {
margin: 0;
padding: 0;
width: 50px;
height: 50px;
display: inline-block;
width: 100%;
border: 0;
}
I added vertical-align: top to your divs and textarea and set the width to 100%. I also set the border to 0 because it overflows by 2px.
Just add display:block to the textarea and it sholud be fixed.
You can check it here -> https://jsfiddle.net/h0mwo9ox/4/
Quick suggestion, if you can, it is better to use specific classes instead of a generic div style, specially if your project became big it is better to manage then.