mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Fr 29.03.2024 01:12 Benutzername: Passwort: Auto-Login

Thema: Problem mit DIVS vom 29.11.2010


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> Problem mit DIVS
Autor Nachricht
Flyerpost
Threadersteller

Dabei seit: 21.11.2010
Ort: Brackenheim
Alter: 37
Geschlecht: Männlich
Verfasst Mo 29.11.2010 14:31
Titel

Problem mit DIVS

Antworten mit Zitat Zum Seitenanfang

Hallo,

ich habe wieder ein kleines Problem.
Bin gerade dabei, DIVS zu positionieren.

in der HTML Datei, also im Webbrowser sind die DIVS alle richtig positioniert, nur im Dreamweaver (Ansichtmodus) nicht. Im Anhang findet ihr das Bild zu der Dreamweaveransicht.




Hier der Link zur richtigen Webansicht: www.showtime24.net/comedyxxl/termine.html

Hier der HTML Code:

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/prototype/1.7/prototype.js'></script>
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/scriptaculous/1.8.3/scriptaculous.js'></script>
<script type='text/javascript' src='js/lightview.js'></script>

<script type="text/javascript">
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
</script>

<head>
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Comedy XXL Tour 2011 mit Osman Citir</title>
   <meta name="title" content="Comedy XXL" />
   <meta name="keywords" content="Osman Citir, Willkommen, Vorverkauf, Startseite, 19 Termine, Live, Comedy" />
   <meta name="description" content="Comedy XXL Tour 2011" />
   <link rel="icon" type="image/x-icon" href="img/favicon.gif" />
   <link rel="shortcut icon" type="image/x-icon" href="img/favicon.gif" />
   <link rel="stylesheet" href="css/style.css" type="text/css" media="screen, projection" />
    <link rel="stylesheet" type="text/css" href="css/lightview.css" />

<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-12219814-9']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>
</head>

<div id="wrapper">

<div id="nav">
  <div align="center"><a href="index.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Startseite','','img/nav-start-2.jpg',1)"><img src="img/nav-start-1.jpg" alt="Startseite" name="Startseite" width="135" height="54" border="0"></a><a href="termine.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Termine','','img/nav-termine-2.jpg',1)"><img src="img/nav-termine-1.jpg" alt="Termine" name="Termine" width="135" height="54" border="0"></a><a href="tickets.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Tickets','','img/nav-tickets-2.jpg',1)"><a href="termine.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Termine','','img/nav-termine-2.jpg',1)"></a><a href="Link" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Shop','','img/nav-shop-2.jpg',1)"><img src="img/nav-shop-1.jpg" alt="Shop" name="Shop" width="135" height="54" border="0"></a><a href="catering.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Catering','','img/nav-catering-2.jpg',1)"><img src="img/nav-catering-1.jpg" alt="Catering" name="Catering" width="135" height="54" border="0"></a><a href="media.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Media','','img/nav-media-2.jpg',1)"><img src="img/nav-media-1.jpg" alt="Media" name="Media" width="135" height="54" border="0"></a><a href="partner.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Partner','','img/nav-partner-2.jpg',1)"><img src="img/nav-partner-1.jpg" alt="Partner" name="Partner" width="135" height="54" border="0"></a><a href="presse.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Presse','','img/nav-presse-2.jpg',1)"><img src="img/nav-presse-1.jpg" alt="Presse" name="Presse" width="135" height="54" border="0"></a></div>
</div>

<div id="header"></div>

<div id="content">

<div id="willkommen">
<p><span class="ueberschrift1">Sichern Sie sich schnell die Tickets! Osman Citir LIVE!</span></p>
<p>&nbsp;</p>
<p>Wenn Sie ein Fan von hochwertiger Comedy sind, sollten Sie sich im Jahr 2011 Osman Citir nicht entgehen lassen. Sein 2 stündiges Programm wird für viel Gesprächsstoff sorgen. Osman Citir ist einer der besten Newcomer der deutschen Comedyszene und wird für diesen Hammerpreis nicht mehr LIVE zu sehen sein!</p>
<p>&nbsp;</p>
<p>Schenken Sie doch dieses Jahr etwas lustiges zu Weihnachten!</p>
</div>
     
<div id="termin-moerlenbach">
<p class="ueberschrift1">MÖRLENBACH BÜRGERHAUS</p>
<p><img src="img/termine/15.01..png" alt="15.01. Mörlenbach Bürgerhaus" width="99" height="101" align="left"></p>
<p>&nbsp;</p>
<p>Einlass ab 18.30 Uhr | Aftershowparty ab 22.45 Uhr</p>
<p>&nbsp;</p>
<p>Bestellen Sie ihre Tickets über unseren <a href="shop.html" target="_self">Onlineshop</a> und sparen Sie bares Geld! <a href='http://www.showtime24.net/comedyxxl/moerlenbach-informationen.html' rel='iframe' title=' :: Veranstaltungsinformationen :: width: 620, height: 620' class='lightview'>Hier </a>erfahren Sie mehr über den Termin!</p>
</p></div>
 
<div id="termin-muehlacker">
<p class="ueberschrift1">MÜHLACKER MÜHLEHOF</p>
<p><img src="img/termine/29.01..png" alt="29.01. Mühlacker Mühlehof" width="99" height="101" align="left"></p>
<p>&nbsp;</p>
<p>Einlass ab 18.30 Uhr | Aftershowparty ab 22.45 Uhr</p>
<p>&nbsp;</p>
<p>Bestellen Sie ihre Tickets über unseren <a href="shop.html" target="_self">Onlineshop</a> und sparen Sie bares Geld! <a href='http://www.showtime24.net/comedyxxl/muehlacker-informationen.html' rel='iframe' title=' :: Veranstaltungsinformationen :: width: 620, height: 620' class='lightview'>Hier</a>
 erfahren Sie mehr über den Termin!</p>
</div>

<div id="termin-oberhausen-rheinhausen">
<p class="ueberschrift1">MÖRLENBACH BÜRGERHAUS</p>
<p><img src="img/termine/15.01..png" alt="15.01. Mörlenbach Bürgerhaus" width="99" height="101" align="left"></p>
<p>&nbsp;</p>
<p>Einlass ab 18.30 Uhr | Aftershowparty ab 22.45 Uhr</p>
<p>&nbsp;</p>
<p>Bestellen Sie ihre Tickets über unseren <a href="shop.html" target="_self">Onlineshop</a> und sparen Sie bares Geld! Hier erfahren Sie mehr über den Termin!</p>
</div>
 
<div id="termin-bretten">
<p class="ueberschrift1">MÜHLACKER MÜHLEHOF</p>
<p><img src="img/termine/29.01..png" alt="29.01. Mühlacker Mühlehof" width="99" height="101" align="left"></p>
<p>&nbsp;</p>
<p>Einlass ab 18.30 Uhr | Aftershowparty ab 22.45 Uhr</p>
<p>&nbsp;</p>
<p>Bestellen Sie ihre Tickets über unseren <a href="shop.html" target="_self">Onlineshop</a> und sparen Sie bares Geld! <a href='http://www.showtime24.net/comedyxxl/muehlacker-informationen.html' rel='iframe' title=' :: Veranstaltungsinformationen :: width: 600, height: 600' class='lightview'>Hier</a>
 erfahren Sie mehr über den Termin!</p>
</div>
</div>

<div id="footer"><a href="kontakt.html" target="_self">Kontakt</a> | <a href="impressum.html" target="_self">Impressum</a></div>
</div>

</body>
</html>


Und die CSS:

Code:
* {
   margin: 0;
   padding: 0;
}

body {
   font: 12px/18px Arial, Tahoma, Verdana, sans-serif;
   width: 100%;
   background-image: url(../img/headbg.jpg);
   margin-left: 0px;
   margin-top: 0px;
   margin-right: 0px;
   margin-bottom: 0px;
   background-repeat: repeat-x;
   background-color: #0156FF;
}

a {
   color: #FFF;
   outline: none;
   text-decoration: underline;
   font-style: normal;
   font-weight: bold;
}

a:hover {
   text-decoration: none;
}

p {
   margin: 0 0 0px
}

img {
   border: none;
}

input {
   vertical-align: middle;
}


/* Wrapper
-----------------------------------------------------------------------------*/
#wrapper {
   width: 960px;
   margin-top: 0;
   margin-right: auto;
   margin-bottom: 0;
   margin-left: auto;
}


/* Stile
-----------------------------------------------------------------------------*/
.ueberschrift1 {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 15px;
   text-decoration: underline;
   font-weight:bold
}

a:link {
   color: #000;
   text-decoration: none;
}
a:visited {
   text-decoration: none;
   color: #000;
}
a:hover {
   text-decoration: underline;
   color: #666;
}
a:active {
   text-decoration: none;
   color: #666;
}
/* Nav
-----------------------------------------------------------------------------*/
#nav {
   height:54px;
}


/* Header
-----------------------------------------------------------------------------*/
#header {
   height: 356px;
   background-image:url(../img/head.jpg);
}


/* content
-----------------------------------------------------------------------------*/
#content {
   background-image: url(../img/content_bg.jpg);
   background-repeat: repeat;
   height: auto;
   float: left;
   width: 960px;
}

#willkommen {
   margin-left:35px;
   margin-right:35px;
   color: #000;
   text-align: justify;
   background-image: url(../img/osman-vorschau.png);
   height: auto;
   padding-left: 151px;
   padding-top: 15px;
   background-repeat: no-repeat;
   clear: both;
   width: 730px;
}

#aktion1 {
   width: 410px;
   height: 130px;
   margin-left:35px;
   color: #000;
   text-align: left;
   float: left;
   background-image: url(../img/content_aktion1_bg.jpg);
   background-repeat: no-repeat;
   padding: 10px;
}

#aktion2 {
   width: 410px;
   margin-right: 35px;
   color: #000;
   text-align: justify;
   float: right;
   background-color: #FFF;
   height: 130px;
   background-image: url(../img/content_aktion1_bg.jpg);
   padding: 10px;
}

#aftershowparty {
   width: 870px;
   height: auto;
   color: #000;
   text-align: left;
   padding: 10px;
   float: right;
   margin-buttom: 25px;
   margin-left: 35px;
   margin-right: 35px;
   background-color: #FFF;
   background-image: url(../img/content_aftershowparty_bg.jpg);
   background-repeat: no-repeat;
   margin-top: 15px;
}

#termin-moerlenbach {
   width: 410px;
   height: 130px;
   margin-left:35px;
   msrgin-bottom:15px;
   color: #000;
   text-align: left;
   float: left;
   background-image: url(../img/content_aktion1_bg.jpg);
   background-repeat: no-repeat;
   padding: 10px;
   margin-bottom: 15px;
}

#termin-muehlacker {
   width: 410px;
   height: 130px;
   margin-right:35px;
   margin-button:20px;
   color: #000;
   text-align: left;
   float: right;
   background-image: url(../img/content_aktion1_bg.jpg);
   background-repeat: no-repeat;
   padding: 10px;
   margin-bottom: 15px;
}

#termin-oberhausen-rheinhausen {
   width: 410px;
   height: 130px;
   margin-left:35px;
   msrgin-bottom:15px;
   color: #000;
   text-align: left;
   float: left;
   background-image: url(../img/content_aktion1_bg.jpg);
   background-repeat: no-repeat;
   padding: 10px;
   margin-bottom: 15px;
}

#termin-bretten {
   width: 410px;
   height: 130px;
   margin-right:35px;
   margin-button:20px;
   color: #000;
   float: right;
   background-image: url(../img/content_aktion1_bg.jpg);
   background-repeat: no-repeat;
   padding: 10px;
   margin-bottom: 15px;
}
/* Footer
-----------------------------------------------------------------------------*/
#footer {
   height: 44px;
   background-image:url(../img/footer.jpg);
   background-repeat: no-repeat;
   clear: both;
   text-align: right;
   padding-right: 35px;
   padding-top: 3px;
}

/* SLIMBOX
-----------------------------------------------------------------------------*/
#lbOverlay {
   position: absolute;
   z-index: 9999;
   left: 0;
   width: 100%;
   background-color: #000;
   cursor: pointer;
}

#lbCenter, #lbBottomContainer {
   position: absolute;
   z-index: 9999;
   left: 50%;
   overflow: hidden;
   background-color: #fff;
}

.lbLoading {
   background: #fff url(../img/loading.gif) no-repeat center;
}

#lbImage {
   position: absolute;
   left: 0;
   top: 0;
   border: 10px solid #fff;
   background-repeat: no-repeat;
}

#lbPrevLink, #lbNextLink {
   display: block;
   position: absolute;
   top: 0;
   width: 50%;
   outline: none;
}

#lbPrevLink {
   left: 0;
}

#lbPrevLink:hover {
   background: transparent url(../img/prevlabel.gif) no-repeat 0% 15%;
}

#lbNextLink {
   right: 0;
}

#lbNextLink:hover {
   background: transparent url(../img/nextlabel.gif) no-repeat 100% 15%;
}

#lbBottom {
   font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;
   font-size: 10px;
   color: #666;
   line-height: 1.4em;
   text-align: left;
   border: 10px solid #fff;
   border-top-style: none;
}

#lbCloseLink {
   display: block;
   float: right;
   width: 113px;
   height: 22px;
   background: transparent url(../img/closelabel.gif) no-repeat center;
   margin: 5px 0;
   outline: none;
}

#lbCaption, #lbNumber {
   margin-right: 71px;
}

#lbCaption {
   font-weight: bold;
}
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
DerM

Dabei seit: 18.01.2009
Ort: -
Alter: 42
Geschlecht: Männlich
Verfasst Mo 29.11.2010 14:34
Titel

Antworten mit Zitat Zum Seitenanfang

Und was willst Du jetzt wissen? Vergiss die Vorschau von Klickibunti DW!
  View user's profile Private Nachricht senden
Anzeige
Anzeige
Flyerpost
Threadersteller

Dabei seit: 21.11.2010
Ort: Brackenheim
Alter: 37
Geschlecht: Männlich
Verfasst Mo 29.11.2010 14:43
Titel

Antworten mit Zitat Zum Seitenanfang

Ich wollte bzw. will nur wissen, wieso das 4 DIV im Dreamweaver Vorschaubeispiel nicht neben dem dritten DIV angezeigt wird, sowie bspw. auf den genannten Link.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
snuwie

Dabei seit: 06.07.2010
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Mo 29.11.2010 14:51
Titel

Antworten mit Zitat Zum Seitenanfang

weil du, wie schon gesagt, die vorschau von dw in die tonne treten kannst *zwinker*

btw: http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.showtime24.net%2Fcomedyxxl%2Ftermine.html
  View user's profile Private Nachricht senden
Smooth-Graphics

Dabei seit: 22.05.2006
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Mo 29.11.2010 16:26
Titel

Antworten mit Zitat Zum Seitenanfang

snuwie hat geschrieben:
weil du, wie schon gesagt, die vorschau von dw in die tonne treten kannst *zwinker*

Dreamweaver hat u.a. seit CS5 die WebKit Browserengine eingebaut, so dass das richtig interpretiert wird. Allerdings kann es natürlich bei dir aus ganz verschiedenen Gründen zu einer Fehldarstellung kommen.

Meine Vermutungen:
1. DW <CS5
2. Validate your HTML + CSS
3. DW-In-Fenster-Breite nicht korrekt für korrektes Rendering

Aber: Wie die anderen User bereits gesagt haben, Dreamweaver bietet zwar eine Ansicht und macht vieles korrekt, aber einen reinen Browser kann dies nicht ersetzen.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
 
Ähnliche Themen problem mit IE und divs
Problem mit DIVS
CSS Problem mit Divs
Problem mit verschachtelten DIVs im IE.
CSS Problem - Divs überlagern sich.
CSS problem mit floatenden DIVS und der Höhe
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Programmierung


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.