I'm working on the CSS for a website for a project and my Footer DIV has decided it wants to get out and see the wide world. All the elements inside the footer are displaying correctly, they're just deciding to float over the top of my content DIV/  I've tried an absolute to get the thing to stay put and had zero luck with that. It will stay put if i used a 'fixed' but I'm not happy with how that looks.  This is how the footer is defined in my CSS sheet.  footer { float: left;  width: 960px;  height: 40px;  background-image: url("images/footer.jpg"); background-repeat: no-repeat;}       Here's how the Footer is implemented at the bottom of the Index.html page  &lt;div id="footer" class=copyright&gt; &lt;p&gt;Copyright 2019- Nature Snap Photography Site Maintained by____&lt;/p&gt; &lt;/div&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt;
3362
I have a simple 2-column layout with a footer that clears both the right and left div in my markup.  My problem is that I can't get the footer to stay at the bottom of the page in all browsers.  It works if the content pushes the footer down, but that's not always the case.
84424
This is the document:  \documentclass[12pt]{article} \usepackage[top=3in, bottom=3in, left=3in, right=3in]{geometry} \usepackage{lipsum} \interlinepenalty=10000 \begin{document} This is first short par\footnote{foot note}  \lipsum[1] \end{document}   As you can see the foot note is "glued" to the text and is not a "foot" note any more.. How can I make drop it down to the bottom of the page, where it will look like a real foot note?
48709
Every time I try to do something seemingly-simple in CSS, it doesn't work.  I have a content div that contains a 460x160 image. All I want to do is position the image at the bottom-right corner and wrap my text around it.  &lt;div id="contents"&gt;     &lt;img src="..." /&gt;     text text text text text text ... &lt;/div&gt;   So I want it to look like:  ------------------ | text text text | | text text text | | text text -----| | text text |    | ------------------   Doing it with a top-left or top-right image is cake:  #contents img { float:right; }  ------------------ | text text |    | | text text -----| | text text text | | text text text | ------------------   Now how do I push that to the bottom? The best I've come up with so far are:  #contents img { float:right; margin-top: 90%} // really needs to be 100%-160px  ------------------ | text text      | | text text      | | text text -----| | text text |    | ------------------   In this case the text does not print in the margin, so there is white space above the image.  #contents { position:relative; } #contents img { position:absolute; right:0; bottom:0; }  -or-  // move the img tag under the text in the html and: #contents img { float:right; margin-top:-160; }  ------------------ | text text text | | text text text | | text text -----| | text text | te | ------------------   In this case the text prints over or under the image.  So... how can I accomplish this?
21651
I'm looking for a source/spec that can tell me what CSS properties can applied to which HTML elements.  For instance, the css property; "overflow".  I know I can apply this to div, p, textarea but what other elements can I apply this too?  Is there a spec somewhere I can reference?
66335
(clickable)  Mainad has a valid height and width, however it isn't shown like subad1/subad2. Which are in essence exactly the same! (just a different background image).  Firebug shows my div as greyed out for some weird reason. Replacing the contents of mainad with just some text doesn't solve the problem (problem isn't related to inner elements)..   What's going on?! :(
20230
I just got a short algorithm on my page, and it keeps getting aligned at the center of the page. But I want to have it aligned at the top, what do I have to do?
30440
I am using the default theme, and use the following to customize the footline,  \useoutertheme{infolines} \setbeamertemplate{footline}{\hspace*{.5cm}\scriptsize{\insertshorttitle \hspace*{50pt} \hfill\insertframenumber\hspace*{.5cm}}\\ \vspace{9pt}}    I don't like it also appears on the title page. Is there a simple way not to show it on the first page?
68321
I have a CSS rule like this:  a:hover { background-color: #fff; }   But this results in a bad-looking gap at the bottom on image links, and what's even worse, if I have transparent images, the link's background color can be seen through the image.  I have stumbled upon this problem many times before, but I always solved it using the quick-and-dirty approach of assigning a class to image links:  a.imagelink:hover { background-color: transparent; }   Today I was looking for a more elegant solution to this problem when I stumbled upon .  Basically what it suggests is using display: block, and this really solves the problem for non-transparent images. However, it results in another problem: now the link is as wide as the paragraph, although the image is not.  Is there a nice way to solve this problem, or do I have to use the dirty approach again?  Thanks,
98356
The first post I've seen this on is .        Note how the text in the comments runs off the right hand side of the page.  This seems to be due to the programmers.SE link in one of the comments, and might need some break-word styling...  What makes this even more of a problem is that the page is fixed to the width of my screen, so I can't scroll horizontally to get the rest of the comments.
17457
I have a table that is longer than one page. I have found the option to make the header of the table to be added to the second portion of the table after the page break. Is there a way to do the same thing with a footer on the table? I want to add a footer so that if my table was 1000 entries long (12 pages), that the first and last row of each page would be consistent; a header and footer for the table. If I edit the rest of the document (above the table) the table will shift up/down and I want to header and footer of the table to remain at the page breaks. Any ideas?     PAGE BREAK   HEADER OF TABLE TBL TBL TBL TBL TBL TBL TBL TBL TBL TBL TBL TBL FOOTER OF TABLE      PAGE BREAK   HEADER OF TABLE TBL TBL TBL TBL TBL TBL FOOTER OF TABLE  TEXT TEXT TEXT TEXT TEXT TEXT      PAGE BREAK
118743
I want the footer of all pages to be "Page N°X" on the right. I used this:  \usepackage{fancyhdr} \pagestyle{fancy} \fancyhf{} % clear all header and footer fields \fancyhead[R]{\leftmark} \fancyfoot[R]{\footnotesize Página N$^\circ$ \thepage\ } \renewcommand{\headrulewidth}{0pt} \renewcommand{\footrulewidth}{0pt}   It works on every page but the chapter beginning ones.
86942
I have a container div that holds two internal divs; both should take 100% width and 100% height within the container.  I set both internal divs to 100% height. That works fine in Firefox, however in IE the divs do not stretch to 100% height but only the height of the text inside them.  The following is a simplified version of my style sheet.  #container {    height: auto;    width: 100%; }  #container #mainContentsWrapper {    float: left;     height: 100%;    width: 70%;    margin: 0;    padding: 0; }   #container #sidebarWrapper {          float: right;     height: 100%;    width: 29.7%;    margin: 0;    padding: 0; }   Is there something I am doing wrong? Or any Firefox/IE quirks I am missing out?
93718
Math Stack Exchange was much better before the top bar was made a floating header, always in the way of reading the site especially when scrolling up and down.  Is there a way to remove this remedial nuisance; the information the banner holds is not needed so often that it has to always be on the screen.
118541
I usually only allow paragraphs to be indented when there's a need for them to be: only if the previous "element" could be confused and thus "merged" with the paragraph in question.  In practical terms, this means that there's no indentation after a \medskip or \bigskip, nor after itemize or enumerate, nor after displayed math.  Now, when typesetting floats it's hard to enforce this style: I'd like to leave no indentation after a float (in my opinion, it's hard to confuse things here).  Given, a paragraph may well finish "flush" to the right margin and continue a new sentence just after the float...  The "solution" I'm looking for then would be to force floats to occur (as many as need to) inside paragraphs, so that the first letter after the float is a lowercase, non indented, letter.  Any ideas?  PS: I usually also set \setlength\parfillskip=2em plus 1 fil, so as to have a consistent "visual clue" that a paragraph is over.
2347
I have the age-old problem of a div wrapping a two-column layout. My sidebar is floated, so my container div fails to wrap the content and sidebar.  &lt;div id="container"&gt;   &lt;div id="content"&gt;&lt;/div&gt;   &lt;div id="sidebar"&gt;&lt;/div&gt; &lt;/div&gt;   There seem to be numerous methods of fixing the clear bug in Firefox:   &lt;br clear="all"/&gt; overflow:auto overflow:hidden   In my situation, the only one that seems to work correctly is the &lt;br clear="all"/&gt; solution, which is a little bit scruffy. overflow:auto gives me nasty scrollbars, and overflow:hidden must surely have side effects. Also, IE7 apparently shouldn't suffer from this problem due to its incorrect behaviour, but in my situation it's suffering the same as Firefox.  Which method currently available to us is the most robust?
37744
I have a container div with a fixed width and height, with overflow: hidden.  I want a horizontal row of float: left divs within this container. Divs which are floated left will naturally push onto the 'line' below after they read the right bound of their parent. This will happen even if the height of the parent should not allow this. This is how this looks:  ![Wrong][1] - removed image shack image that had been replaced by an advert  How I would like it to look:  ![Right][2] - removed image shack image that had been replaced by an advert  Note: the effect I want can be achieved by using inline elements &amp; white-space: no-wrap (that is how I did it in the image shown). This, however, is no good to me (for reasons too lengthy to explain here), as the child divs need to be floated block level elements.
26936
I have a responsive blog where ads are displayed in the sidebar. On mobile devices however, the sidebar is pushed to the bottom below the posts.   So what I'd like to do is move the ads from the sidebar and insert them into the post itself on mobile devices   I do this using javascript:  &lt;div id="main"&gt;     &lt;div id="article"&gt;         &lt;div class="post"&gt;             &lt;p class="intro"&gt;&lt;/p&gt;             &lt;p class="text"&gt;&lt;/p&gt;         &lt;/div&gt;     &lt;/div&gt;     &lt;div id="sidebar"&gt;         &lt;div class="adbox-1"&gt;&lt;/div&gt;     &lt;/div&gt;     &lt;/div&gt;  &lt;script&gt;     jQuery(document).ready(function(){          // AD REPOSITION         if ($(window).width() &lt; 769) {             $('.ad-box1').insertAfter($('.intro'));                    }      }); &lt;/script&gt;   The ads are always loaded in the sidebar, but if the screen width is below 768px, they will be moved somewhere else.  I wonder if this would violate AdSense terms of service?