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 months ago.
Improve this question
I'm building a web app using HTML & SVG, and I've run into a weird problem with tables. When I move my table into a particular div, all the cells lose their spacing.
This is my expected result:
This is what I actually get:
To achieve the expected result, I put my table 'habitruler' inside 'main' but above 'habits':
What I want to do though is put 'habitruler' inside 'habits' like this:
All I'm doing is moving it inside another div, but the moment I do that all the spacing disappears between cells as you see in image #2.
This is the css for the div 'habits':
And this is the table inside 'habitruler':
This even happens when I remove all the other child elements from 'habits'. I can't find anything out of the ordinary that would cause this. I also can't find any information on tables that would explain this behaviour. Does anyone have an idea why this is happening, or what I can try next to find out?
habitruler maybe inherits style from habits, try !important
(also show css from devtools for habitruler)
Try using:
table{ table-layout:fixed; width: 100%;}
If it doesn't solve the problem please show what's styling and is having. So, I can propose better solution.
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 6 days ago.
Improve this question
I have a form in HTML with several fields ordered in two columns. The tab key make the browser goes from top to bottom in the first column and then start from the top of the second one, but I need the order to be row by row.
I try using the tabindex property in my javaScript, but those fields with that property are omited by the browser.
An user gave me this links where explain why is not a goot idea to use tabindex:
https://karlgroves.com/why-using-tabindex-values-greater-than-0-is-bad/
I solve the problem editing the html/jsvaScript.
Instead of having 2 columns I wrote rows with two div inside.
The row has display:flex attributte,
row div has width: 47%
and
row div:first-of-type margin-right:6%
That solved my problem and make the tab order works the way i want.
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 was working on a web development project using HTML and Tailwind css, Everything is looking fine on desktop mode but as soon as go to mobile mode the index page shows some extra space on the right side of the page. Tried using overflow-x :hidden but it doesn't fix anything. I have attached the Image and Live demo of the project below.
Heroku Live demo
Hi,
this problem faced me and i have solution.
This problem because you make the menu to go right and this cause scrolling horizontally and overflow doesn't work
Mobile Ignore overflow on body tag
Try to make div and hold your page content and give him
overflow-x: hidden.
It will work
The problem is related to the markers added by some lib, maybe the one taking care of the animations.
If you remove them before changing to mobile view, the space on the right side disappears.
I had same problem and for me was hepful overflow-x: hidden
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
I'm just starting in on a new site and am getting extra space at the top of the div's I'm building for the home page. Using Safari's Web Inspector, I've eliminated any obvious padding or margins being responsible; but it's also seemingly telling me that the height of the div's is, for some reason, set to a greater amount than the image which should be its maximum height.
Sigh.... 10 minutes in and I'm already banging my head against my desk. Well, about to anyway.
This is the very-much-in-progress site:
http://compassionglobally.org/wordpress/
You can see a black strip above the first area and a grey one above the second area. I can't figure out where that space is coming from. And it's really bothering me.
I am using a WordPress theme which I realize may be interfering in my formatting, but I suspect that this isn't really the issue.
I removed all spaces and carriage returns since I know that this can cause space to be inserted, but it hasn't helped. I hope another set of eyes can!
Thanks!
Adam
Maybe you just remove the blank <p></p> that you really don't need it.
remove that <p></p> after the <img/>.
And your layout will be good.
Take a look(which <p></p> you should remove it.)
It comes from the paragraph margin. Probably the easiest way to fix it (without removing the margins) is to wrap those paragraphs inside a container or to do something like this to the .homeStripContent:
.homeStripContent {
float: left;
width: 100%;
}
Or just to negate the top margin: .homeStripContent {margin-top: -28px;}
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
It should be easy, but I'm having trouble with this issue
I have a variable number of div's with text in them and each with overflow: scroll
I want to be able to detect which div the user is scrolling, and store that div's id into a JS variable, but my attempts are not working...
My code is here: http://jsfiddle.net/7pn85ae8/
Ah, it took me a minute, but I see in your JSFiddle, everything you wrote is fine -!
The problem simply appears to be that you are not including jQuery -
Have a look at the fiddle, and then, in your code, add this snippet somewhere before your code:
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
You'll see the only thing that i changed was the alert - and that I added jQuery on the drop-down menu on the left...
Cheers -!
http://jsfiddle.net/7pn85ae8/1/
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 usually build my wordpress sites by using a theme and creating a child theme. Generally I have done this with Wordpress 2013, but this time decided to take a crack at it with 2014. I have run into a few issues but finally landed on one I have not been able to resolve.
http://demo.diocesan.com/robert/
On this page, it tells me the page has a height of 2000+ px. When I try to find where this height is computed, I find nothing. I have set the height on many different elements to 1000px (even the HTML tag itself) and I still have this mysterious height value.
I suspect this has something to do with the 2014 masonry script (Admittedly I am not great with javascript) and any direction on this would be helpful. So my question - Does anyone upon glancing at this know where the height is coming from and what steps I can take to remove it?
The problem is the CSS on #secondary - it has min-height: 100vh applied, which will make that one element at least one full viewport tall.
It's then hidden because the following element (#primary) which contains the content is given a float: left which makes it move up, so that it appears that the gap is beneath #primary, even though it's not.
Removing the min-height on #secondary, or setting it to a sensible value, will fix your problem.