Warum ist der Inhalt in jQuery Dialogfeld Art der verkrampft?

Question

$(document).ready(function() { 
     $('.something').each(function() { 

      var $link = $(this); 

      $link.click(function() { 

       var $dialog = $('<div></div>') 
       .load($link.attr('href')) 
       .dialog({ 
        autoOpen: false, 
        title: "Edit Book", 
        width: 'auto', 
        height: 'auto' 
       }); 

       $dialog.dialog('open'); 

       return false; 
      }); 
     }); 
    }); 

Ich habe diesen Code, um den Inhalt anzuzeigen, der durch das Attribut href des Anchor-Tags verknüpft ist. Das funktioniert perfekt! Aber das einzige Problem ist, dass alle Informationen in der jQuery-Dialogbox verkrampft sind.

Normalerweise, wenn nicht in einem Dialogfeld die Seite so aussieht, wie ich es will. http://awesomescreenshot.com/0983qpcad

Aber wenn in einem Dialogfeld sieht es so aus, verkrampft!
http://awesomescreenshot.com/09c3qpf1b

Gibt es etwas offensichtlich, ich vermisse in Bezug auf Optionen in jQuery Dialogfeld? Oder irgendwelche Ideen zu möglichen Korrekturen? Danke eine Million im Voraus :)

Answer 1

Überprüfen Sie Ihre CSS-Regeln - es scheint, dass sie nicht auf Elemente innerhalb des Dialogs angewendet werden.

Meine Vermutung ist, dass Ihr Stylesheet in der Zielseite enthalten ist, die von $link.attr('href') verwiesen wird. Wenn Sie jedoch den Seiteninhalt mit load laden, werden Stylesheets und andere nicht inhaltsbezogene Elemente verworfen. Sie müssen das CSS in die übergeordnete Seite einfügen.