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 }
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 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
I am trying to have my image appear on top of a 300px border, as if the border is a background color for the image. This is my code:
.containerpagecontent { border-left: 300px solid #fff; } img { float:left; }
But it is still not working. What am I doing wrong?
NOTE: I cannot simply use background-color for the image, because the end of the image has to extend off the color.
There is no such thing as:
margin-left: 300px solid #fff;
you probably meant:
border-left: 300px solid #fff;
Also, see if something like this might work for you: http://jsfiddle.net/Lb6Rz/. It's using the padding and background properties on a single element to create a border.
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.