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
Hi I have a test page up here http://blueanchorcreative.com/
There is a little tiny gap between the slider and the header and I can't figure out what it is? I tried applying overflow hidden to the header but that jacked up the rest of the page and I couldn't figure out how to make that work! Please help a newbie!
LOOK AT THE VALUE:
#slideshow > div {
bottom: 10px;
left: 10px;
position: absolute;
right: 10px;
top: 10px; // this value to 0px
}
You just need to remove top: 10px value from the rule:
#slideshow > div {
top: 0;
}
It's at the line 195 of http://blueanchorcreative.com/style.css
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
I'm looking for a way to gradient images from the bottom to top
initial vs
goal
Images run in slick slider. I've already tried with radiant gradient but without any useful results.
It is not blur, it is linear gradient from black to transparent. You can use some element or pseudoelement (after/before) to place it over image and give it linear-gradient.
Something like this:
.my-cool-item {
position: relative;
display: inline-block;
}
.my-cool-item:after {
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 300px;
background: linear-gradient(180deg, rgba(0,0,0,0), black);
}
<div class="my-cool-item">
<img src="https://i.stack.imgur.com/IuWLZ.jpg"/>
</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 7 years ago.
Improve this question
so I am trying to make my banner expand across the page,
I have already tried width: 100% but it has a gap (about 5px width) on either side, any ideas why it's doing this?
CSS
.banner {
width: 100%;
height: 300px;
border-bottom: 1px solid #000;
}
It is your browser default margins and padding, do this in your css:
body {
margin: 0;
padding: 0;
}
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
Having a little problem with the comment part on the website i'm working on:
http://whybaguio.com/php/profile/businessprofile.php?id=103#
See how the ADD YOUR OWN FEEDBACK! div goes down together with the Facebook comment. I don't know how to not let it go down with the facebook comments.... Lol, I'm not really sure if I'm explaining my self right but I hope you guys get it...
I tried positioning it relative and absolute but it goes out of its parent div....
Please help me out, thank you!
Okay, this is a problem with how to use position:absolute; What you need to do is change your code like this:
#feed {
background: white;
height: 280px;
padding: 10px;
margin-top: 295px;
overflow-y: auto;
margin-left: -580px;
position: relative;/*this needs to have a position for .secondcomment to 'hook on' to*/
}
.secondcomment {
position: absolute;
top: 10px;
right: 0;
}
If i understand it right: place the "ADD YOUR OWN FEEDBACK" div before the "Facebook comment" div in your HTML code.
Your "ADD YOUR OWN FEEDBACK" div has a "float: right" property and blocks with "float" should go before non-floating blocks.
You can set float: left; property to .fb-comment class, and remove margin-left property from .secondcomment class.
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
The below css coding is used in my page. But in chrome it displays the image fine. but in firefox it breaks. I dont know why it shows like that. If anybody know the solution for this please help me. Thanks in advance.
.vote
{
position:absolute;
margin: 53px 3px 0 115px;
}
http://domian.com/mysite/pollpage.php?id=2&mview=72
This is my website page. The vote image alignment is correct in chrome but not in firefox
add position relative
.contentbox
{
position: relative;
}
and remove margin ,
add bottom and right
.vote {
position: absolute;
bottom: 0;
right: 45px;
}
...
Now define your main div #polling .pollpagewidth div .contentbox position relative and give to img tag position absolute and define right or bottom value according to your design
Hi now add this css in your style sheet and fixed this problem
#polling .pollpagewidth div .contentbox{
position:relative;
}
.contentbox > img {
bottom: 16px;
margin: 0;
padding: 0;
position: absolute;
right: 43px;
}
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
How do I move the unnecessary spacing underneath the form in my footer? I've tried everything.
The bigger the screen resolution gets, the WIDER that GAP/Spacing gets :/
I'm still learning to get better at coding so don't laugh!
Code:
#form { margin-top: 80px; margin-left: 730px;}
#footer{ background: #311C68; width: 100%; height: 100%;}
Try to remove height: 100% from #footer
#footer{ background: #311C68; width: 100%;}