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
My page here on the left hand nav is showing the categories (div.cat) spaced out at 48px height and I can't work out why.
There's no padding or margins or height specified. If someone could have a look on an inspector to see what could be causing it that'd be great.
The clearfix is causing issues within the child. The whole structure is a tangle of block and inline elements that should be cleaned up in one way or another. Any block elements within each category seem unnecessary. You probably also want to use a ul for greater semantic meaning.
There is class .cat declared in the css file.
.cat, .cat a {
padding: 0 5px;
color: #444066;
}
remove the padding from there or reduce the padding from 5px to 0px
and another thing is found is in the body class
body {
line-height: 1.6;
font-size: 15px;
}
which increses line-height of all divs and elements
Related
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 3 years ago.
Improve this question
I was wondering what the best way is to get some white space below paragraphs and other elements. I have seen man websites that have empty p-divs in the html(created by ), but this is probably bad practise, isn't it? Is it recommended to use margins in this case?
As noted in the comments, use margin styling. You can add a class to you divs and style on that, or you can add a default style to all tags of a certain type, etc.
<p class="my-paragraph">
Here is some text.
</p>
.my-paragraph {
margin: 15px;
}
or if you want to apply it to all
p {
margin: 15px;
}
And you can target different margin directions:
p {
margin-top: 15px;
margin-bottom: 20px;
margin-left: 50px;
margin-right: 15px;
}
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 used Bootstrap on my WordPress site, I used the bootstrap grid to divide the contents of the page into two, one of them is having a card which acts like a nav menu.
The problem is the <ul> element is not taking full width.
In the left side of the site, there are two items named "introduction", which is not taking full width.
I tried
display:inline;
display: flex;
flex-wrap: wrap;
padding: 0px;
none of them work.
Your website has margin: 0 0 1.5em 3em; applied to all ul and ol elements. You might want to figure out where that's coming from and remove it. Or you could just override it by adding this to your stylesheet:
ul, ol {
margin: 0
}
In card > .list-group give
margin: 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
Can anyone explain me, why <input> and <a> have different heights (while having same font, padding, margin and border settings) in Internet Explorer 9-11? Firefox and Chrome render them with the same height.
Here is example:
HTML
<input class="text" value="input"/>
<a class="text">button</a>
CSS
.text {
font-family: 'Arial';
padding: 7px;
font-size: 12px;
line-height: 1.4em;
border: 1px solid black;
display: block;
float: left;
width: 100px;
margin: 0;
}
And fiddle
Is there any way to prevent such behavior in IE? Thank you in advance.
There is a Question similar to this one which already got many answers and 18000 views.
I think you will find a solution to yours there too
CSS - Exact same height and alignment of button and input text box
Also you could just try to give both of them a height: XYpx so you can make sure they will always have the same heights. I guess giving them a height will also be better for your styling later on
I also found this Question on how to control the heights in different browsers
How can I control the height of text inputs and submit input buttons in different browsers?
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 8 years ago.
Improve this question
I have a css problem.
I would like the white border between the
"end" of the screen away it really is against it.
Jsfiddle:
http://goo.gl/KL5iYJ
You can remove the top border by setting the body's padding and margin to 0, like such:
body {
padding:0px;
margin:0px;
}
This will eliminate the whitespace above and to the sides of your menu.
I don't fully understand what you're asking, but I'm guessing this simple block solves what you are attempting to reach
body {
margin: 0;
padding: 0;
}
Put in your css:
html, body {
margin:0;
padding:0;
}
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 am trying to align "Discuss" "Bury" with the above text in the site but in vain
http://pligg.marsgibson.info/story.php?title=latest-headling-mews-gossip-fun-entertainment-music-gala-and-so-on-for-you-only-for-the-purpose-of-entertaining-you
see the screenshot
I want to align just as in the screenshot
how this can be achieved ?
You need to move that span.linksummaryDiscuss into div with storycontent1 class
or just wrap it in a div and style it (somewhat simliar to div.storycontent1)
.newdiv {
padding: 0 80px;
width: 580px;
}
Option 1
Remove the left padding from .storycontent1:
.storycontent1
{
padding-left:0;
}
Then add the padding to .storycontent
.storycontent
{
padding-left:80px;
}
Option 2
Add this style rule:
#linksummaryDiscuss {
padding-left: 80px;
}
This option will only work if the Discuss span is always there.
move the style: padding: 0 80px; from .storycontent1 selector to .storycontent.