Help - Search - Members - Calendar
Full Version: Button drops down 1 line
HTMLHelp Forums > Web Authoring > Cascading Style Sheets
CharlesEF
Hi All,

Once again I find myself with a CSS problem that has me stumped. If you will look at this page you will see 5 buttons at the bottom. I added 1 more button thinking it would line up with the other 5. It didn't, it dropped down 1 line. After spending much time over the last week trying to figure this out I find I have to turn to the experts. You might have to shrink your browser window in order for the footer to scroll. Without the scrollbar you can only see part of the button. I even moved the button before the Cancel button, now I have 2 buttons that drop down, the Exit button is on a line by itself and the Cancel button is also on a new line.

What have I overlooked?


Thanks for any help,

Charles
pandy
You've made that button display: block.

CODE
.show {
    display: block;
CharlesEF
Well, I didn't think about that. My show class doesn't apply to buttons. I can always use the style attribute instead of a class attribute, since this is the only place that is different.

Thanks for your help,

Charles
pandy
Or just don't give that button the class 'show'...
CharlesEF
QUOTE(pandy @ Sep 21 2019, 05:17 PM) *

Or just don't give that button the class 'show'...

This 1 button will be hidden 95% of the time. It is only shown when the page is loaded in an iframe. The container that holds the buttons is already set for 'inline-block' so when I added this 1 button and used the 'show' class it never clicked that I was making this problem. This seems to happen when I look at things too long. Instead of creating a new class just for this button I will use the style attribute to hide (by default) and 1 function call to show the button when needed. I use the style attribute to override CSS rules for some elements anyway.


Thanks for your help,

Charles
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2019 Invision Power Services, Inc.