Questions tagged [margin]
The CSS margin properties define the space around elements.
3,601
questions
0
votes
1
answer
13
views
Styling -webkit-scrollbar to be shorter than the height of the container?
I'm trying to style up the scrollbar so that it's positioned inside the scrollable area (container with scrollbar), effectively with margin just on the top & bottom of the bar itself.
In the ...
0
votes
1
answer
19
views
Is the default margin for <body> tag deprecated in html5
I have read in forums and in some old documentation, that there is a default margin on the body tag of 8px. But on This Site I read that all the default styling attributes of body tag has been ...
2
votes
1
answer
20
views
Changing body margin depending on nav height
On the website I am making, I have a navbar and then an image right under it.
<Navbar />
<img src="idk" />
<!-- Example -->
My Navbar uses fixed position which means that ...
0
votes
0
answers
15
views
Disable HTML 3.2 headers and footers
There are many answers explaining how to disable headers and footers in HTML5 and CSS3:
<style type="text/css" media="print">
@page {
size: auto;
margin:...
0
votes
1
answer
22
views
left transition not working both ways (works left to right but not the other way around)
I use position relative and absolute on the switch and handle respectively, then use left on the handle to move it to the end or start of 'cSwitch' but the transition duration i applied only works ...
0
votes
1
answer
17
views
React native margin: 'auto' working on web but not on device
I am building an application which uses react native on expo dev. I am trying to add a button in the top left corner which is adjacent to some text o the right hand side, I have used marginRight: '...
0
votes
4
answers
32
views
Remove Vertical margins between Flex Children
I'm trying to create a simple grid-based ASCII graphics system in HTML.
The system interprets an array of single-character strings as a grid, with regular partitions representing rows.
These rows are ...
2
votes
1
answer
57
views
Text moves when hovering
Every time I hover over social bar and it gets bigger , headers moves down some pixels. I know it's because of the margin, but I don't know how to fix it. CSS code:
.socialbar {
/* color: white; ...
0
votes
1
answer
18
views
Why is there an extra bottom margin? [duplicate]
My black border triangle is centered. But there is an extra bottom margin and (hence the scroll bar appears). Why?
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
height: ...
1
vote
1
answer
12
views
CSS Child Margins do not Collapse while Angular Animation
I have two vertical stacked parent-boxes which each have several children. These children have a set margin-top and margin-bottom. In a static environment these child-margins collapse.
The second ...
0
votes
0
answers
20
views
absolutely position elements and margins [duplicate]
why 'margin-bottom' have no effect on absolutely positioned element that have 'width' and 'top' properties set. Same goes for 'margin-top' if element has 'bottom' property set
.first {
position: ...
1
vote
0
answers
35
views
Why are the items not in the middle? [duplicate]
The display of the container is flex and the flex-direction: column so I tried using align-self to move a heading to the center but it does not work.
Should I use margin: auto intead?
Also, I tried ...
-1
votes
1
answer
66
views
When the font size is changed, the margin/padding above and below the div become asymmetrical [duplicate]
I'm trying to make the div symmetrically spaced but when I increase the font size to 200% or 32px, the lower padding, which is of 3em and the <body> tag's margin of 3 em gets mismatched due to ...
0
votes
1
answer
59
views
How to remove the gap between to widgets in a column?
I have a Column with two Containers. There is no padding, no margin.
The sizes perfectly fit together.
But still, I got this subpixel gap between widgets. It is visible on the simulator and real ...
0
votes
0
answers
6
views
margin on edge-of-screen elements do not working
I added margin to the last photo, but it doesn't apply. This issue only occurs on iPhone. How can I solve this?
also, I don't want any way to add padding to the body.
enter image description here
...
0
votes
1
answer
37
views
force ggplot to plot and includes all the annotation that is outside the plot in r
I am trying to plot a correlation matrix that includes thousands of pairwise comparisons. I am thinking to use ggplot2 in R to plot it out. There are 4 main issues would like to address (some of them ...
0
votes
0
answers
19
views
Page still showing margin on the right despite setting body tag margin to zero
I have set the globalstyle margin to zero , as i want to the webpage to have a max width of 1600px , the problem is the website still shows an width of 1768px regardless, when i had a look at the ...
0
votes
1
answer
28
views
Negative margin-right with left floats in the parent container
Learning CSS basics and was doing layouts with floats. I know CSS Grid and Flexbox are best practice and I intend to learn them, but wanted to understand the basics of floats before I move on.
...
0
votes
1
answer
23
views
HTML Get the slider closer to the edge
I installed a slider at my banner and use this html code:
<header>
<section role="banner"> <!-- flexslider begins -->
<div class="slideshow-...
0
votes
0
answers
29
views
carousel card responsive view is not working
enter image description herewhen I am using it on web its working fine , but as soon as I go on mobile view , only images is visible and data overflows out of the card ,
#slider {
height:...
0
votes
0
answers
10
views
Why the <label> size is different on Firefox?
In all other browsers, these cards (.resort__cards) are correctly spaced. Because the <label> is the same size as the <img> (even though the <img> tag is the child element and the &...
1
vote
0
answers
32
views
Changing the margins of a PDF document in RMarkdown
The default resume template from the pagedown package is visually not very appealing. There are quite white spaces along the borders, the sidebar is too thick, and the font is not appropriate. I guess ...
0
votes
1
answer
32
views
Adding bottom padding or margin to an element gives unwanted width to entire page
/* GLOBAL STYLES */
*{
margin: 0;
padding: 0;
box-sizing: border-box;
}
h1{
Font-Family: 'Ovo', Serif;
font-size: 90px;
}
h2,h3,h4,h5,h6,p{
Font-Family: 'Quattrocento Sans', Sans-Serif;
}...
0
votes
1
answer
63
views
Error while sending trade commands to bybit testnet
I am using Alertatron to send manual alerts to bybit testnet exchange. I am getting the following error log. Please let me know what the issue is
======error start==
[v283, bybit, jothibybit, EOSUSD] ...
0
votes
0
answers
57
views
Flutter ignore padding or margin without using stack widget
is there a way to ignore parent widget margin or padding without using stack? what i tried it to achieve it but couldn't success:
it is just moving widget on x axis regarding the padding of parent.
...
1
vote
2
answers
35
views
How to decrease margin between divs as window resizes?
I'm working on a project in which I have a left menu and a form positioned as can be seen in the following image:
As you can see there is a margin between these two elements, in this case the margin ...
0
votes
1
answer
19
views
Undefined margin in the header of webpage [duplicate]
I was supposed to make the header section of a webpage which should look like this. Desired webpage look.
(The HTML and CSS code has been enclosed)
So how I approached towards creating the HTML file ...
0
votes
1
answer
79
views
Viewing a site using Chrome developer tools to simulate an iPhone 12 looks different than viewing the site on an actual iPhone 12. Why is this?
Sections of my site look a little different on Chrome Dev Tools simulating an iPhone 12 than an actual iPhone 12. Why is this? I've signed up for browserstack. Do you guys think they produce an ...
0
votes
0
answers
6
views
How to remove space above scatterplot3d while box = F
I have a plot generated with scatterplot3d. I set box asbox = F with the goal to have several 2D plots visualized as 3D. Now as I want to save the plot, I have a huge margin on the top that results ...
0
votes
1
answer
11
views
Why do successive elements with negative margins influence the content flow differently than a single element with negative margin?
Screenshot of Result of code-example below:
I have 3 columns of items in the example:
The first column contains 4 boxes with normal content flow.
The second column contains the same boxes but one ...
2
votes
1
answer
27
views
Why do vertical margins not collapse?
Consider the following MWE
<!doctype html>
<html>
<style>
div.compact-inverse {
border: 1px solid black;
}
div.compact-inverse > input {
display: inline-block;
...
0
votes
0
answers
20
views
Big white spacing can't remove or fixed with bootstrap
After I finished my code I found big white spacing and can't remove it if i added items to the cart the space get smaller but i want the footer at the bottom but when i use bootstrap class fixed-...
0
votes
2
answers
32
views
figure on the center of its parent element using CSS
Trying to center the figure i.e .c-yellow , .c-blue but it didn't got center vertically. I need to center horizontally and vertically both:
*,
*:before,
*:after {
box-sizing: border-box;
...
0
votes
2
answers
41
views
On a css margin-top: -10%, what is that percentage based off? [duplicate]
I'm trying to figure out what is the percentage of a negative css margin.
.box1 {
border:1px solid red;
height: 250px;
display: flex;
}
.box2 {
border:1px solid blue;
height: 120px;
...
1
vote
1
answer
26
views
Vertical margins do not overlap [duplicate]
Vertical margins by default do overlap, for instance if I have one div with bottom margin set to 20px, and the next div top margin to 30px the space between the two div`s should be 30px.
Im my case ...
2
votes
2
answers
53
views
HTML element's bottom margin in Firefox
The <html> element doesn't have a bottom margin in Firefox (version 97.0.1):
html {
margin: 1em;
background: green;
}
body {
margin: 0;
height: 1200px;
background: tan;
}
Is ...
0
votes
0
answers
32
views
Too large margin (css)
When i start use @media (max-width: 1300px) to .steps__column:first-child - i find large (*2) margin between first and second column. I can remove it only with
@media (max-width: 1300px) {
....
0
votes
1
answer
29
views
Row of images that has the same left margin as other content
My goal is to add a row of images that has the same margin-left as the other content on the page, like the title in the image below. The row of images should scroll horizontally and be visible to the ...
-1
votes
1
answer
49
views
TextView margins not working inside LinearLayout
I have this simple xml below. The problem is that none of the layout_marginLeft, layout_marginRight, layout_marginTop or layout_marginBottom work. But layout_margin works!
<LinearLayout
...
0
votes
2
answers
43
views
How do I remove invisible space around text (Heading)?
So as the title say I put a color on top of an image and I then tried to put some text on top of it, but then all the div got moved to the bottom and the text got moved to the top of the div and when ...
0
votes
0
answers
12
views
Text of bar plot cut out by margin sizes
I am relatively new to R and am trying to make a horizontal bar plot. The issue I have is that the plot cuts off my Y axis titles. I have tried using mar() but as I say I'm quite new to this and can't ...
0
votes
1
answer
53
views
Collapsing margin in grid?
I've added a margin to the grid boxes and want to have the same space between the outer margin and inner one. But it seems that you cant collapse margins in a grid so the outer border is half as thick ...
0
votes
1
answer
48
views
How to make a child element wider than its parent div, but not fill the entire browser width and be responsive?
I'm using negative margins to make a child element (.alignwide with width = 1000px) wider than its parent div (.wrapper with width = 800px), but I don't want it to fill the entire browser width.
This ...
0
votes
1
answer
47
views
grid layout with 100% height and margin in HTML 5 with an HTML 5 CSS reset
I am trying to get a page with a grid layout and margin.
I have the code below. I am using a CSS reset.
When I add a margin to body it adds a scroll bar to the main body/page. I don't want that. I ...
0
votes
1
answer
21
views
How can I specify a margin to a chapter reference link in HTML?
I have a body with an header (100px), and a container with a magin (100px).
Like this :
.myHeader {
height: 100px;
}
.myContainer {
margin-top: 100px;
}
I'm writing some texts with chapters and ...
0
votes
1
answer
40
views
parent element take margin of child element in html css? [duplicate]
strong text
i dont understand why my header go down when i give to his child (.navigation) margin-top?
if i give padding its okay my header stays on the top
but why not by giving margin
i did research ...
0
votes
1
answer
32
views
Are margin and padding only applied to layout and element respectively?
I’m a UX designer and currently working on WYSIWYG editor. I was wondering if this structure (displayed in the image) correct?
If so, are margin and padding only applied to layout and element ...
1
vote
1
answer
15
views
How can I calculate a hover state change based on the original state values?
This may not be possible using just CSS alone buuuut let's give her a whirl.
For example: I have an image with certain margins. let's say something like this:
img {
margin-left: 1em;
}
What I want to ...
0
votes
3
answers
63
views
Why won't my image align to the right? CSS
I am stuck on this simple issue. How the heck do I align my image to the right border of the box? I tried float:right, align-self: end, margin: -4em, I tried most things I found online but nothing.
As ...
0
votes
1
answer
210
views
Is Angular adding margin/padding to my component?
I'm facing a little problem.. I'm trying to build some kind of "Matrix" to build a snake game in angular, and for some reason, there is a margin / padding I can not remove. Here is my code:
&...