Radio-button og tekst i en tabel

CSS kode 

 label {
   display: block;
   margin-bottom: 5px;
 }

CSS kode 

 .dg-question-option > label {
   display: inline;
 }

HTML kode 

 <tr>
     <td><input type="radio" value="mit-svar" name="mit-sporgsmål"></td>
     <td>Min valgmulighed tekst</td>
 </tr>

JScript kode 

 <script type="text/javascript" src="http://www.musikipedia.dk/scripts/quiz/dg-quiz-maker.js"></script>
 <style type="text/css">
 body {
 .dg-question-label{ /* Question label */
     font-weight:bold;
 }
 .bokstjek{
     padding:20px;
 }
 </style>
 <table class="akt akt-quiz"><tr><td class="aktiv"><img alt="Quiz" src="http://www.musikipedia.dk/scripts/grafik/billeder/quiz.png" width="40" height="40" border="0" /></td>
 <td class="aktiv1">
 <b>Quiz - Tip en 15'er</b>
 <div id="questions"></div>
 <div id="error"></div>
 <div id="result"></div>
 
 </td></tr></table>
 
 <script type="text/javascript">
 
 function showWrongAnswer(){
     document.id('error').set('html', 'Wrong answer, Please try again');
 }
 
 function showScore() {
     var score = quizMaker.getScore();
 
     var el = new Element('h3');
     el.set('html', 'Resultat: ' + score.numCorrectAnswers + ' ud af ' + score.numQuestions + ' rigtige!<br /><br /> ');
     document.id('result').adopt(el);
 
     if(score.incorrectAnswers.length > 0) {
         el = new Element('h4');
         el.set('html', 'Du svarede desværre forkert på følgende spørgsmål:<br /><br />');
         document.id('result').adopt(el);
 
         for(var i=0;i<score.incorrectAnswers.length;i++) {
             var incorrectAnswer = score.incorrectAnswers[i];
             el = new Element('div');
             el.set('html', '<i>' +  incorrectAnswer.questionNumber + ': ' + incorrectAnswer.label);
             document.id('result').adopt(el);
 
             el = new Element('div');
             el.set('html', 'Korrekt svar: ' + incorrectAnswer.correctAnswer);
             document.id('result').adopt(el);
             el = new Element('div');
             el.set('html', 'Dit svar: ' + incorrectAnswer.userAnswer + '<br /><br />');
             document.id('result').adopt(el);
 
         }
     }
 
 }
 
 var questions = [
     {
         label : '<i>Hvilket år blev det første internationale grandprix afholdt?</i>',
         options : ['1952', '1956', '1962'],
         answer : ['1956'],
         forceAnswer : true
     },
     {
         label : '<i>Hvilket år var Danmark første gang med i det internationale grandprix?</i>',
         options : ['1957', '1960', '1963'],
         answer : ['1957'],
         forceAnswer : true
     },
     {
         label : '<i>Hvor mange gange har Danmark vundet det internationale grandprix?</i>',
         options : ['2', '3', '4'],
         answer : ['3'],
         forceAnswer : true
     },
     {
         label : '<i>Hvilken sang vandt Danmark med ved det internationale grandprix i 2000?</i>',
         options : ['Fly on the Wings of Love','Dansevise','Vi maler byen rød'],
         answer :['Fly on the Wings of Love'],
         forceAnswer : true
     },
     {
         label : '<i>Hvornår blev reglen om, at man skulle synge på sit eget sprog, endeligt afskaffet ved det internationale grandprix?</i>',
         options : ['1986','1993','1999'],
         answer :['1999'],
         forceAnswer : true
     },
     {
         label : '<i>Hvornår blev orkestret afskaffet ved det internationale grandprix?</i>',
         options : ['1977','1988','1999'],
         answer :['1999'],
         forceAnswer : true
     },
     {
         label : '<i>Hvor længe må en sang højst vare ved grandprix?</i>',
         options : ['2.30 minutter','3.00 minutter','3.30 minutter'],
         answer :['3.00 minutter'],
         forceAnswer : true
     },
     {
         label : '<i>Hvad karakteriserer mange af sangteksterne ved det internationale granprix?</i>',
         options : ['Simple tekster med udgangspunkt i internationalt forståelige ord','Historiske tekster med udgangspunkt i sangenes oprindelsesland','Sjove tekster, ofte med vrøvleord, rim og remser'],
         answer :['Simple tekster med udgangspunkt i internationalt forståelige ord'],
         forceAnswer : true
     },
     {
         label : '<i>Hvad hed det finske heavy metal-band, der vandt det internationale granprix i 2006?</i>',
         options : ['Crowned','Cats on Fire','Lordi'],
         answer :['Lordi'],
         forceAnswer : true
     },
     {
         label : '<i>Hvilken tekstforfatter har vundet det danske grandprix flest gange?</i>',
         options : ['Keld Heick','Lise Cabble','Sejr Volmer-Sørensen'],
         answer :['Keld Heick'],
         forceAnswer : true
     },
     {
         label : '<i>Hvilken af følgende sange er ikke en grandprix-sang?</i>',
         options : ['Disco Tango','Danse i måneskin','Den bedste tid'],
         answer :['Den bedste tid'],
         forceAnswer : true
     },
     {
         label : '<i>Hvilken sammenslutning afholder det internationale grandprix?</i>',
         options : ['ESC - European Screencasting Corporation','ERN - European Radio Network', 'EBU - European Broadcasting Union'],
         answer : ['EBU - European Broadcasting Union'],
         forceAnswer : true
     },
     {
         label : '<i>Hvilket årti betegner mange som et sort årti i dansk grandprix-historie?</i>',
         options : ['1970&#39;erne','1980&#39;erne','1990&#39;erne'],
         answer :['1990&#39;erne'],
         forceAnswer : true
     },
     {
         label : '<i>Hvilke lande blev fra 2001-2008 beskyldt for at rotte sig sammen?</i>',
         options : ['De skandinaviske lande','Østlandene','Spanien, Portugal, Belgien og Italien'],
         answer :['Østlandene'],
         forceAnswer : true
     },
     {
         label : '<i>Hvad er ESC en forkortelse for?</i>',
         options : ['Europäische Singspiel Commission','European Singing Competition','Eurovision Song Contest'],
         answer :['Eurovision Song Contest'],
         forceAnswer : true
     }
 
 ]
 
 function showAnswerAlert() {
     document.id('error').set('html', '<i><font color="red">Du skal vælge et svar, før du kan fortsætte til næste spørgsmål.</font></i>');
 }
 function clearErrorBox() {
     document.id('error').set('html','');
 }
 var quizMaker = new DG.QuizMaker({
     questions : questions,
     el : 'questions',
     forceCorrectAnswer:false,
     listeners : {
         'finish' : showScore,
         'missinganswer' : showAnswerAlert,
         'sendanswer' : clearErrorBox,
         'wrongAnswer' : showWrongAnswer
     }
 });
 quizMaker.start();
 </script>

JScript kode 

 /************************************************************************************************************
 [D]html[G]oodies Quiz maker script
 Copyright (C) August 2010  DTHMLGoodies.com, Alf Magne Kalleland
 
 This library is free software; you can redistribute it and/or
 modify it under the terms of the GNU Lesser General Public
 License as published by the Free Software Foundation; either
 version 2.1 of the License, or (at your option) any later version.
 
 This library is distributed in the hope that it will be useful,
 but WITHOUT ANY WARRANTY; without even the implied warranty of
 MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
 Lesser General Public License for more details.
 
 You should have received a copy of the GNU Lesser General Public
 License along with this library; if not, write to the Free Software
 Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
 
 Dhtmlgoodies.com., hereby disclaims all copyright interest in this script
 written by Alf Magne Kalleland.
 
 Alf Magne Kalleland, 2010
 Owner of DHTMLgoodies.com
 
 ************************************************************************************************************/
 
 if(!window.DG) {
     window.DG = {};
 };
 
 DG.QuizMaker = new Class( {
     Extends : Events,
 
     validEvents : ['start','sendanswer', 'correctanswer','wronganswer', 'finish','missinganswer','wrongAnswer'],
 
     config: {
         seconds: null,
         forceAnswer : false
     },
 
     html : {
         el : null
     },
 
     internal : {
         questionIndex : 0,
         questions : null,
         labelAnswerButton : 'Fortsæt'
     },
 
     user : {
         answers : []
     },
 
     forceCorrectAnswer:false,
 
     initialize : function(config) {
         if(config.el) {
             this.html.el = config.el;
         }
         if(config.forceAnswer) {
             this.config.forceAnswer = config.forceAnswer;
         }
         if(config.forceCorrectAnswer !== undefined)this.forceCorrectAnswer = config.forceCorrectAnswer;
         if(config.labelAnswerButton) {
             this.internal.labelAnswerButton = config.labelAnswerButton;
         }
 
         this.internal.questions = config.questions;
 
         if(config.listeners) {
             for(var listener in config.listeners) {
                 if(this.validEvents.indexOf(listener)>=0) {
                     this.addEvent(listener, config.listeners[listener]);
                 }
             }
         }
     },
 
     _displayQuestion : function() {
         this._clearEl();
         this._addQuestionElement();
         this._addAnsweringOptions();
         this._addAnswerButton();
     },
 
     _addQuestionElement : function() {
         var el = new Element('div');
         el.addClass('dg-question-label');
         el.set('html', this._getCurrentQuestion().label);
         document.id(this.html.el).adopt(el);
     },
 
     _addAnsweringOptions : function() {
         var currentQuestion = this._getCurrentQuestion();
         var options = currentQuestion.options;
         var isMulti = currentQuestion.answer.length > 1;
 
         for(var i=0;i<options.length;i++) {
             var el = new Element('div');
             el.addClass('dg-question-option');
 
             var option = options[i];
             var id = 'dg-quiz-option-' + this.internal.questionIndex + '-' + i;
 
             var checkbox = new Element('input', {
                 name : 'dg-quiz-options',
                 id : id,
                 type : isMulti ? 'checkbox' : 'radio',
                 value : option
             });
 
             el.adopt(checkbox);
 
             var label = new Element('label', { 'for' : id, 'html' : option });
             el.adopt(label);
 
 
             document.id(this.html.el).adopt(el);
         }
     },
 
     _addAnswerButton : function() {
         var el = new Element('div');
         el.addClass('dg-answer-button-container');
 
         var button = new Element('input');
         button.addClass('btn btn-primary');
         button.type = 'button';
         button.set('value', this.internal.labelAnswerButton);
         button.addEvent('click', this._sendAnswer.bind(this));
         el.adopt(button);
 
         document.id(this.html.el).adopt(el);
     },
 
     _sendAnswer : function() {
         var answer = this._getAnswersFromForm();
 
         this.fireEvent('sendanswer', this)
         var currentQuestion = this._getCurrentQuestion();
         if((this.config.forceAnswer || currentQuestion.forceAnswer) && answer.length == 0) {
             this.fireEvent('missinganswer', this);
             return false;
         }
 
         this.user.answers[this.internal.questionIndex] = answer;
 
         if(!this._hasAnsweredCorrectly(this.internal.questionIndex) && (this.forceCorrectAnswer || currentQuestion['forceCorrectAnswer'])){
             this.fireEvent('wrongAnswer', this);
             return false;
         }
 
 
         this.internal.questionIndex++;
 
         if (this.internal.questionIndex == this.internal.questions.length) {
             this._clearEl();
             this.fireEvent('finish');
         }
         else {
             this._displayQuestion();
         }
     },
 
     _getAnswersFromForm : function() {
         var ret = [];
         var els = document.id(this.html.el).getElements('input');
         for(var i=0;i<els.length;i++) {
             if(els[i].checked) {
                 ret.push( {
                     index : i,
                     answer : els[i].value
 
                 });
             }
         }
         return ret;
     },
 
     _clearEl : function () {
         document.id(this.html.el).set('html','');
     },
 
     _getCurrentQuestion : function() {
         return this.internal.questions[this.internal.questionIndex];
     },
 
     start : function() {
         this._displayQuestion();
 
     },
 
     getScore : function() {
         var ret = {
             numCorrectAnswers : 0,
             numQuestions : this.internal.questions.length,
             percentageCorrectAnswers : 0,
             incorrectAnswers : []
         };
 
         var numCorrectAnswers = 0;
         for(var i=0;i<this.internal.questions.length; i++) {
             if(this._hasAnsweredCorrectly(i)) {
                 numCorrectAnswers++;
             }else{
                 ret.incorrectAnswers.push({
                     questionNumber : i+1,
                     label : this.internal.questions[i].label,
                     correctAnswer : this._getTextualCorrectAnswer(i),
                     userAnswer : this._getTextualUserAnswer(i)
                 })
             }
         }
 
         ret.numCorrectAnswers = numCorrectAnswers;
         ret.percentageCorrectAnswers = Math.round(numCorrectAnswers / this.internal.questions.length *100);
 
         return ret;
     },
     _getTextualCorrectAnswer : function(questionIndex) {
         var ret = [];
         var question = this.internal.questions[questionIndex];
         for(var i=0;i<question.answer.length;i++) {
             var answer = question.answer[i];
             if(question.options.indexOf(answer) == -1) {
                 answer = question.options[answer];
             }
             ret.push(answer);
         }
         return ret.join(', ');
     },
 
     _getTextualUserAnswer : function(questionIndex) {
         var ret = [];
         var userAnswer = this.user.answers[questionIndex];
         for(var i=0;i<userAnswer.length;i++) {
             ret.push(userAnswer[i].answer);
         }
         return ret.join(', ');
     },
     _hasAnsweredCorrectly : function(questionIndex) {
         var correctAnswer = this.internal.questions[questionIndex].answer;
         var answer = this.user.answers[questionIndex];
 
         if(answer.length == correctAnswer.length ) {
             for(var i=0;i<answer.length;i++) {
                 if(correctAnswer.indexOf(answer[i].answer) == -1 &&  correctAnswer.indexOf(answer[i].index) == -1){
                     return false;
                 }
             }
             return true;
         }
 
         return false;
     }
 });

Årsagen skyldes at du bruger bootstrap. I bootstrap.ccs linje 741:

CSS kode 

 label {
   display: block;
   margin-bottom: 5px;
 }

En måde at løse det på er at lave en mere specifik regel:

CSS kode 

 .dg-question-option > label {
   display: inline;
 }

Du kan også lave den uden '>', eller med 'inline-block' i stedet for inline.

Dette besvarer selvfølgelig ikke direkte dit spørgsmål om man kan det med en table. Hvis det virkelig er det du vil, så noget lignende det her for hver svarmulighed:

HTML kode 

 <tr>
     <td><input type="radio" value="mit-svar" name="mit-sporgsmål"></td>
     <td>Min valgmulighed tekst</td>
 </tr>