zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Seltsame Positionierungen im IE7

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 13.11.2011, 18:28
Benutzerbild von japanworm
Confuser
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 14.07.2011
Ort: Japan
Beiträge: 143
japanworm befindet sich auf einem aufstrebenden Ast
Standard Seltsame Positionierungen im IE7

Hallo.

Ich bräuchte erneut eure Hilfe. Mir reicht schon ein kleiner Anstoß in die richtige Richtung, damit ich weiß, woran genau ich arbeiten muss.

Das Layout hat den Crossbrowser-Check gut überstanden, nur ein paar kleine Probleme im IE7, die ich aber nicht aus eigener Kraft ausmachen und korrigieren kann.

Das Problem ist zum einen in der Navigationsleiste:

Soll so aussehen:


Sieht im IE7 aber so aus:



Und zum anderen in der Blogbeitrag-Ansicht:

Soll so aussehen: klick
Sieht aber recht katastrophal im IE7 aus: klick

Bei der Navigationsleiste habe ich schon viel versucht, das lässt sich im IE7 scheinbar einfach nicht hinbiegen. Damit könnte ich leben, aber das andere Problem sieht einfach sehr unschön und unprofessionell aus.

Hier kann man das Problem live betrachten.

Validiert habe ich soweit möglich. Die Share-Buttons sind einfach nicht valide, aber daher rührt das Positionierungsproblem nicht, glaube ich!

Vielen herzlichen Dank im Voraus und Gute Nacht!
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 15.11.2011, 04:42
Benutzerbild von japanworm
Confuser
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 14.07.2011
Ort: Japan
Beiträge: 143
japanworm befindet sich auf einem aufstrebenden Ast
Standard

Keiner eine Idee?

Vielleicht liegt das Problem ja auch darin, dass ich's nicht im Stylesheet habe, sondern es hardgecodet ist.

Ich habe 3 Divs, die ich nebeneinander platziert habe:

Code:
<div class="suscribe">	<h3>Subscribe:</h3>
<div style="float:left; border-right:1px solid #dddddd; 
padding-left:15px; padding-right:15px;">
<p style="font-size:11px;">
<a href="http://www.twitter.com/zoomingjapan" title="Follow me on Twitter">
<img style="float:left; margin-top:-2px;" src="
<?php bloginfo('template_directory'); ?>/images/social2/twitter.png" 
alt="twitter" /></a> <span style="float:right;">Join <strong><?php echo 
rarst_twitter_user('zoomingjapan', 'followers_count'); ?>
</strong><br /> Followers.</span></p></div>
<div style="float:left; border-right:1px solid #dddddd; 
border-left:1px solid #ffffff; padding-left:15px; 
padding-right:20px;"><p style="font-size:11px;">
<a href="http://www.zoomingjapan.com/feed" 
title="Subscribe to RSS feed"><img 
style="float:left; margin-top:-2px;" src="<?php bloginfo('template_directory'); ?>/images/social2/rss.png" 
alt="rss" /></a> 
<span style="float:right;">Join <strong><?php if ($fb=="0")
echo $fc;
else
echo $fb; ?></strong><br />  Subscribers. 
</span></p></div>	
<div style="float:right; height:40px; 
width:290px; padding-left:12px; 
border-left:1px solid #ffffff;">
<p style="font-size:11px;">
<a href="http://feedburner.google.com/fb/a/mailverify?uri=ZoomingJapan" title="Subscribe via e-mail">
<img style="float:left; margin-top:-11px;" 
src="<?php bloginfo('template_directory'); ?>/images/subscribe_mail.png" 
alt="e-mail subscription" /></a> 
Or subscribe via <strong>e-mail</strong> 
to stay updated and always receive the latest news. It's <strong>FREE</strong>!</p></div>	
</div>
Wäre echt dankbar, wenn mir jemand weiterhelfen könnte.

Geändert von japanworm (16.11.2011 um 16:03 Uhr)
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 15.11.2011, 07:23
Benutzerbild von hubspe
Eisen 7 ole....
XHTMLforum-Kenner
 
Registriert seit: 22.06.2007
Ort: Passau
Beiträge: 7.086
hubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblick
Standard

Moin,

du floatest #crumbs ohne Breite?
Sowas ist meist keine gute Idee.
__________________
Ein mehrfacher Gruß aus dem Südosten
Klaus
Mit Zitat antworten
  #4 (permalink)  
Alt 15.11.2011, 15:30
Benutzerbild von japanworm
Confuser
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 14.07.2011
Ort: Japan
Beiträge: 143
japanworm befindet sich auf einem aufstrebenden Ast
Standard

Ich könnte dann höchstens mit min-width arbeiten, nicht mit einer fixen Breite, wäre das auch ok?
Mit Zitat antworten
  #5 (permalink)  
Alt 15.11.2011, 19:45
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 24.06.2010
Beiträge: 528
K.Roland wird schon bald berühmt werden
Standard

Hallo,

kannst du dein Quelltext erstmal Lesbar einrücken?. Und validire!

Tipp von mir

- warum behilfst du dich nicht mit einer reduzierten Testseite, ob alles korrekt (valide) angezeigt wird.

___________
Gruß,
Roland
Mit Zitat antworten
  #6 (permalink)  
Alt 16.11.2011, 16:05
Benutzerbild von japanworm
Confuser
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 14.07.2011
Ort: Japan
Beiträge: 143
japanworm befindet sich auf einem aufstrebenden Ast
Standard

@Roland:
Hab den Code jetzt mal eingerückt, finde es aber dadurch nicht unbedingt lesefreundlicher. Hoffe jedoch, dass das trotzdem hilft.

Wie schon erwähnt, sind die Share-Buttons von Facebook und Co. per se nicht valide und die kann ich selbst auch nicht validieren auf meiner Seite. Einzige Option ist, diese gar nicht zu benutzen.

Und wegen der Testseite muss ich mal schaun, ob bzw. wie ich das hinbekommen kann.
Mit Zitat antworten
  #7 (permalink)  
Alt 16.11.2011, 18:51
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 24.06.2010
Beiträge: 528
K.Roland wird schon bald berühmt werden
Standard

Zitat:
Zitat von japanworm Beitrag anzeigen
@Roland:
Hab den Code jetzt mal eingerückt, finde es aber dadurch nicht unbedingt lesefreundlicher. Hoffe jedoch, dass das trotzdem hilft.
So meinte ich das nicht, sondern übersichtlich so wie ein Quelltext Aussehen sollte.

Sorry, mein Fehler.
Dachte du wüstest was mit lesbar gemeint wäre.

_______
Gruß,
Roland

Geändert von K.Roland (16.11.2011 um 18:57 Uhr)
Mit Zitat antworten
  #8 (permalink)  
Alt 17.11.2011, 04:58
Benutzerbild von japanworm
Confuser
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 14.07.2011
Ort: Japan
Beiträge: 143
japanworm befindet sich auf einem aufstrebenden Ast
Standard

Sorry, ich weiß leider nicht genau, wie du den Text gerne möchtest.
Könntest du mir ein Beispiel geben, damit ich den Text entsprechent einrücken kann?
Vielen Dank.
Mit Zitat antworten
  #9 (permalink)  
Alt 17.11.2011, 18:48
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 24.06.2010
Beiträge: 528
K.Roland wird schon bald berühmt werden
Standard

So in etwa sollte ein Quelltext Aussehen, damit man vieleicht auch helfen kann ...
Okay, hier hast du irgend ein Beispiel:

HTML-Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>Seite</title>

     <link rel="stylesheet" href="#" type="text/css" media="screen" />

</head>
<body>

<!-- Start -->
<div id="header">

<h1>Überschrift</h1>
<ul>
   <li><a>Peter</a></li>
   <li><a>Guido</a></li>
   <li><a>Lutz</a></li>
</ul>

<p>Text Text Text</p>
</div>
<!-- geschlossen -->

</body>
</html>
Und nicht so:
HTML-Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"><head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" /><title>Seite</title><link rel="stylesheet" href="#" type="text/css" media="screen" /></head><body><div id="header">
<h1>Überschrift</h1><ul><li><a>Peter</a></li><li><a>Guido</a></li><li><a>Lutz</a></li></ul><p>Text Text Text</p></div></body></html>
____________
Gruß,
Roland
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 18.11.2011, 10:47
Benutzerbild von japanworm
Confuser
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 14.07.2011
Ort: Japan
Beiträge: 143
japanworm befindet sich auf einem aufstrebenden Ast
Standard

Danke für die Mühe.

Hier ein erneuter Versuch:

HTML-Code:
<div class="suscribe">	
<h3>Subscribe:</h3>
<div style="float:left; border-right:1px solid #dddddd; 
padding-left:15px; padding-right:15px;">
<p style="font-size:11px;">
<a href="http://www" title="Follow me on Twitter">
<img style="float:left; margin-top:-2px;" src="" />
</a> 
<span style="float:right;">
Join <strong>X</strong><br /> 
Followers.</span></p>
</div>

<div style="float:left; border-right:1px solid #dddddd; 
border-left:1px solid #ffffff; padding-left:15px; padding-right:20px;">
<p style="font-size:11px;">
<a href="http://www">
<img style="float:left; margin-top:-2px;" src="" />
</a> 
<span style="float:right;">Join <strong>X</strong><br />  
Subscribers. </span></p>
</div>	

<div style="float:right; height:40px; width:290px; padding-left:12px; 
border-left:1px solid #ffffff;">
<p style="font-size:11px;">
<a href="http://">
<img style="float:left; margin-top:-11px;" src="" />
</a> 
Or bla bla bla ...</p>
</div>	

</div>
Das Hauptproblem war wohl auch, dass der Text und die Links zu lang waren. Das wurde jetzt gekürzt, weil es in Bezug auf den Code keine Rolle spielt.

Hoffentlich werden dort jetzt die 3 Divs sichtbar die ich nebeneinander angereiht haben möchte. Was ja wie gesagt in allen Browsern (egal ob alt oder neu) funktioniert hat - bis auf IE7!

Ich hoffe, damit geht's besser.
Ich probiere derweil weiter herum.

Vielen Dank im Voraus für Hinweise und Hilfe.


P.S.:
@hubspe: Vielen Dank für den Tipp mit der Breite, hat super geklappt!


EDIT: Ich hab jetzt auch eine Testseite erstellt, wo man das Problem isoliert betrachten kann: Testseite

Geändert von japanworm (18.11.2011 um 11:09 Uhr)
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
IE7 float-Problem cgdesign CSS 4 22.07.2011 00:35
IE7 fixing - expandable menu matsie CSS 6 10.04.2008 16:55
CSS-basiertes Menü fehlerhaft im IE7 otomo CSS 0 16.10.2007 17:56
Pagezoom und IE7 paracelsus CSS 24 17.08.2007 12:36
Problem mit Dastellung in IE7 und FF ConiKost CSS 1 05.07.2006 13:59


Alle Zeitangaben in WEZ +2. Es ist jetzt 11:09 Uhr.