Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions concerning problems with code you've written must describe the specific problem — and include valid code to reproduce it — in the question itself. See SSCCE.org for guidance.
Closed 9 years ago.
Improve this question
I've looked at every similar question I can find here. I have a div for my right column, and then a div for my footer. But if my right column gets too long, it covers up the footer. What is wrong?
Site: http://www.powerhousestudios.tv/2013/
On your DIV
<div id="rightcolumn">
CSS READS
#rightcolumn {
width: 300px;
float: right;
margin-top: 0px;
margin-bottom: 0px;
background-color: #ffffff;
height: 410px;
Remove the Height Parameter to fix your problem.
The rightcolumn div has a fixed height of 410px, which it seems it's not enough. Just remove the height property.
Your using relative positioning on the upcoming div. That with a z-index of 999 is making it cover your footer div.
Try:
upcoming { z-index: 0;}
and remove the spacing paragraphs in that div to get the effect you want.
Related
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 1 year ago.
Improve this question
So I centered a div totally fine, but after adding border it's no longer centered. It's positioned just like before, but now there is a border, so it's longer and the content is moved to the right by a border width. How to fix this?
Add to your div :
box-sizing: border-box;
So the border is part of the total object's width and height.
Can you send your css code for applying in div?
Please add this code to your div.
.center { margin: auto; width: 50%; border: 3px solid #73AD21 }
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 3 years ago.
Improve this question
I have created a panel that is displayed only when triggered, and the content is determined dynamically.
I didn't want to mess with the page flow so I made it being displayed OVER the other divs.
In order to achieve this I have added z-index and display:absolute.
The problem is that cause of display: absolute my div's width is determines by the content, while I want to it be the same despite the content differences.
How to fix that?
Check my css/sass:
.panel-parent{
text-align: center;
display:none;
//display:block when triggered
position:absolute;
z-index:1;
.panel{
padding-top:50px;
padding-bottom:50px;
display:block;
width:95%;
height: auto;}}
you need to set the parent as position:relative and then the child to position:absolute; height:100%
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
How to adjust the sidebar position? I want to remove the left space in left sidebar. How to do that? Here's the site Thank you
Just Replace this code in css
.widget { margin: 8px -80px 25px; } .sidebar { width: 10%; }
Finally your sidebar will display like this:
In your CSS you have assigned 1170px for your content section and aligned with center. Change that to 100%, it will work.
.ak-container
{
width:100%;
margin:0px auto;
}
Just Use float:left on <div id="primary" class="content-area" style="float: left;">
and remove margin-left:150px; from #fbuilder
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 have the problem on my homepage
Could you help me please? On very big screens it shows my header image left floated.
<div class="row fullWidth">
<img src="img/header.jpg" alt="header-picture"></div>
CSS:
.fullWidth{width: 100%;margin-left: auto;margin-right: auto;max-width: initial;}
What you mean is that the image is aligned left on widescreen monitors.
Do you want it centered or full-width covered?
Then add:
.fullwidth img {
display: block;
width: 100%; /* just add width in case you want the image covering full-width */
margin: 0 auto;
}
to your stylesheet.
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
This question appears to be off-topic because it lacks sufficient information to diagnose the problem. Describe your problem in more detail or include a minimal example in the question itself.
Closed 8 years ago.
Improve this question
My background image, which covers the entire web page, overflows past the HTML and body elements, even though they're both set to 100%.
It's a simple page, as seen here.
I've tried several different techniques to place the background image (including setting it to cover, but I still encounter this overflow issue)
(I feel like I'm going a little crazy, but I'm probably missing something that's very apparent).
Try overflow:hidden
.translucent {
width: 100%;
height: 100%;
background-color: rgba(0, 92, 60, 0.95);
overflow: hidden;
}
I wonder why you set this in the body tag.
It's much easier to give the body tag a background-image.
So i changed your body css style to this:
body {
width: 100%;
height: 100%;
background: url('cover-plaza-707-fifth-construction.jpg') no-repeat center center fixed;
background-size: cover;
position: fixed;
}
And you now can delete <img src="cover-plaza-707-fifth-construction.jpg" id="bg">
I hope this solves the problem, i haven't tested the scrolling yet.
[After reverting it back to a cover background image rather than the standalone image I placed with reduced z-index as a bug fix]
Setting .translucent's min-height to 100% (rather than just height: 100%;) fixed the issue.