Databases
StackOverflow2013
Postsdbo
POCan't float a span inside of a div
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POCan't float a span inside of a div
    primarykey
    data
    text
    <p><strong>UPDATE 2:</strong></p> <p>I can't float a span inside of a div.. </p> <pre><code>&lt;div class="noselect" id="teach_create_pageheader"&gt; &lt;span class="teach_create_pageheader_back"&gt;&lt;/span&gt; Step 1 &lt;span class="teach_create_pageheader_forward"&gt;&lt;/span&gt; &lt;/div&gt; </code></pre> <p>Here's my css. I want them to float left and float to right accordingly.</p> <pre><code>#teach_create_pageheader{ width:880px; height: 30px; margin: -10px; padding-top: 5px; background-color: gray; font-size: 14px; text-align: center; font-weight: bold; color: white; -webkit-font-smoothing: antialiased; -moz-border-radius-topright: 5px; border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; border-top-left-radius: 5px; opacity:0.8; filter:alpha(opacity=80); } .teach_create_pageheader_back{ float: left; margin-bottom: 5px; } .teach_create_pageheader_forward{ float: right; margin-bottom: 5px; } span { display: block; } </code></pre> <p>And I have JQuery making the buttons (as well as others) with this code:</p> <pre><code>(function($){ // Creating the jQuery plugin: $.fn.sweetPages = function(opts){ // If no options were passed, create an empty opts object if(!opts) opts = {}; var resultsPerPage = opts.perPage || 3; // The plugin works best for unordered lists, althugh ols would do just as well: var ul = this; var li = ul.find('li'); li.each(function(){ // Calculating the height of each li element, and storing it with the data method: var el = $(this); el.data('height',el.outerHeight(true)); }); // Calculating the total number of pages: var pagesNumber = Math.ceil(li.length/resultsPerPage); // If the pages are less than two, do nothing: if(pagesNumber&lt;2) return this; // Creating the controls div: var swControls = $('&lt;div class="swControls"&gt;'); for(var i=0;i&lt;pagesNumber;i++) { // Slice a portion of the lis, and wrap it in a swPage div: li.slice(i*resultsPerPage,(i+1)*resultsPerPage).wrapAll('&lt;div class="swPage" /&gt;'); // Adding a link to the swControls div: swControls.append('&lt;a href="" class="swShowPage"&gt;'+(i+1)+'&lt;/a&gt;'); } ul.append(swControls); var maxHeight = 0; var totalWidth = 0; var swPage = ul.find('.swPage'); swPage.each(function(){ // Looping through all the newly created pages: var elem = $(this); var tmpHeight = 0; elem.find('li').each(function(){tmpHeight+=$(this).data('height');}); if(tmpHeight&gt;maxHeight) maxHeight = tmpHeight; totalWidth+=elem.outerWidth(); elem.css('float','left').width(ul.width()); }); swPage.wrapAll('&lt;div class="swSlider" /&gt;'); // Setting the height of the ul to the height of the tallest page: ul.height(maxHeight); var swSlider = ul.find('.swSlider'); swSlider.append('&lt;div class="clear" /&gt;').width(totalWidth); var hyperLinks = ul.find('a.swShowPage'); hyperLinks.click(function(e){ // If one of the control links is clicked, slide the swSlider div // (which contains all the pages) and mark it as active: $(this).addClass('active').siblings().removeClass('active'); swSlider.stop().animate({'margin-left':-(parseInt($(this).text())-1)*ul.width()},'slow'); e.preventDefault(); }); // Mark the first link as active the first time this code runs: hyperLinks.eq(0).addClass('active'); // Center the control div: swControls.css({ 'left':'50%', 'margin-left':-swControls.width()/2 }); return this; }})(jQuery); $(document).ready(function(){ /* The following code is executed once the DOM is loaded */ // Calling the jQuery plugin and splitting the // #holder UL into pages of 3 LIs each: $('#holder').sweetPages({perPage:1}); // The default behaviour of the plugin is to insert the // page links in the ul, but we need them in the main container: var controls = $('.swControls').detach(); controls.appendTo('#main'); function swGotoPage(page){ $('.swShowPage:contains("' + page + '")').click(); } var baseFB = '&lt;input type="button" class="swFB" /&gt;'; var offset = 'pgOffset'; var active = '.swShowPage.active'; var $pgBack = $(baseFB) .attr('id', 'button_back') .attr('value', "Back") .attr(offset, '-1'); var $pgForward = $(baseFB) .attr('id', 'button_forward') .attr('value', "Forward") .attr(offset, '1'); $.each([$pgBack, $pgForward], function(i,$obj){ $obj.click(function(){ var nextPage = parseInt($(active).text(), 10) + parseInt($(this).attr(offset), 10); swGotoPage(nextPage); }); }); $($pgForward).addClass("teach_create_backforward"); $($pgBack).addClass("teach_create_backforward"); $('#teach_create_pageheader_back').replaceWith($pgBack); $('#teach_create_pageheader_forward').replaceWith($pgForward); }); </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. USmskfisher
    1. USJD Audi
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    3. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POCan't float a span inside of a div
      1. This table or related slice is empty.
      1. VTApproveEditSuggestion
    2. VO
      singulars
      1. POCan't float a span inside of a div
      1. This table or related slice is empty.
      1. VTApproveEditSuggestion
    3. VO
      singulars
      1. POCan't float a span inside of a div
      1. This table or related slice is empty.
      1. VTApproveEditSuggestion
    1. COPlease read: http://stackoverflow.com/editing-help + to indent code with four spaces, you can select it and press the `{}` button.
      singulars
      1. POCan't float a span inside of a div
      1. USthirtydot
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload