php-resource



Zurück   PHP-Scripte PHP-Tutorials PHP-Jobs und vieles mehr > Entwicklung > HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS
 

Login

 
eingeloggt bleiben
star Jetzt registrieren   star Passwort vergessen
 

 

 


HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS Probleme mit HTML5, Bootstrap oder jQuery ?

Antwort
 
LinkBack Themen-Optionen Thema bewerten
  #1 (permalink)  
Alt 15-12-2006, 14:04
tams
 Newbie
Links : Onlinestatus : tams ist offline
Registriert seit: Jan 2004
Beiträge: 24
tams ist zur Zeit noch ein unbeschriebenes Blatt
Standard CSS Bildpositionierung bei Firefox/Opear

Hallo,

habe da ein Problem bei meiner ersten kompletten CSS-Site. Ich muß sicherlich noch vieles lernen, bräuchte nun aber mal Eure Hilfe, da ich unbeding endlich den Einstieg in tabellenloses Design schaffen möchte.

Hier mal der Link zur fertigen Layoutansicht als Screenshot:


Endergebnis

Und so weit bin ich momentan (leider):
Status


Probleme habe weniger bei der Positionierung der oberen Grafiken. Eher bei den unteren Grafiken unten links und unten rechts, die sich genau am Rand des Kastens befinden sollen. Später dann möchte ich die Grafiken unten rechts und links dann durch Flashelemente ersetzen.

Bei IE 7 klappt es soweit auch, nur bei Firefox 2.0 und Opera 9.0 ist die rechte untere Grafik einfach nicht an der Linie dran.

Ich hoffe ich habe alles richtig erklärt und nichts vergessen.

Vielen lieben Dank für etwas Hilfe.

Gruß
Torsten

Geändert von tams (15-12-2006 um 16:05 Uhr)
Mit Zitat antworten
freelancermap.de - IT Projektvermittlung für Selbständige und Freiberufler
  #2 (permalink)  
Alt 15-12-2006, 14:08
Kropff
  Administrator
Links : Onlinestatus : Kropff ist offline
Registriert seit: Mar 2002
Ort: Köln
Beiträge: 11.757
Kropff befindet sich auf einem aufstrebenden Ast
Standard

da helfen keine screenshots, sondern code. oder eine online-version

gruß
peter
__________________
Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
Meine Seite
Mit Zitat antworten
  #3 (permalink)  
Alt 15-12-2006, 16:05
tams
 Newbie
Links : Onlinestatus : tams ist offline
Registriert seit: Jan 2004
Beiträge: 24
tams ist zur Zeit noch ein unbeschriebenes Blatt
Standard

Hhmm, versteh ich nicht, ich hab doch einen Link zur meiner noch unfertigen programmierten Version genannt. Aber hier noch mal mein bisheriger Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<title>Unbenannt</title>
</head>

<body>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<title>Layout</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css"><!--
html{
margin: 0px;
padding: 0px;
}

body {
background-color: #ffffff;
font-size: 12px;
font-family: Verdana, Arial, Helvetica, SunSans-Regular, Sans-Serif;
color:#564b47;
padding:10px;
margin:0px;
text-align: center;
}

#inhalt {
text-align: left;
vertical-align: middle;
margin: 0px auto;
margin-top: 40px;
padding: 0px;
width: 988px;
height: 600px;
border: 1px #AEAEAE solid;
background-color: #ffffff;
}


#land {
margin-top: 40px;
padding: 0px;
left: 410px;
top: 303px;
}

#logo {
margin-top: 0px;
padding-top: 10px;
padding-left: 37px;
width: 217px;
height: 45px;
}

#kontaktkompass {
margin-top: 0px;
padding-top: 60px;
padding-left: 800px;
}

#achtungkompass {
margin-top: 0px;
padding-top: 30px;
padding-left: 800px;
}

#barountenrechts {
margin-top: 0px;
padding-top: 10px;
padding-left: 623px;
}

p, h1, pre {
margin: 0px;
padding: 5px 10px;
}
h1 {
font-size: 11px;
text-transform:uppercase;
text-align: right;
color: #564b47;
background-color: #90897a;
}

a {
color: #ff66cc;
font-size: 11px;
background-color:transparent;
text-decoration: none;
}

#logo a img{
border-width: 0;
}

pre {
color: #564b47;
font-size: 11px;
background-color:transparent;
font-family: Courier, Monaco, Monospace;
}
/* ]]> */
--></style>
</head>
<body>

<div id="inhalt">
<div id="land"><img src="images/land_in_sicht.gif" alt="" /></div>

<div id="logo"><a href="#"><img src="images/logo_steuermann.gif" alt="" /></a></div>

<div id="kontaktkompass"><img src="images/kontakt_kompass.gif" alt="" /></div>

<div id="achtungkompass"><img src="images/kontakt_achtung.gif" alt="" /></div>

<div id="barountenrechts"><img src="images/uhr_unten_rechts.gif" alt="" /></div>

</div>



</body>

</html>


</body>
</html>



Gruß
Torsten

Geändert von tams (15-12-2006 um 16:47 Uhr)
Mit Zitat antworten
  #4 (permalink)  
Alt 15-12-2006, 16:20
Kropff
  Administrator
Links : Onlinestatus : Kropff ist offline
Registriert seit: Mar 2002
Ort: Köln
Beiträge: 11.757
Kropff befindet sich auf einem aufstrebenden Ast
Standard

ups, sorry, dachte das war ein bild.
PHP-Code:
#barountenrechts 
{
   
padding-top: ...

pass das mal an. und darin noch ein font-size: 0px; für den ie

gruß
peter
__________________
Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
Meine Seite
Mit Zitat antworten
  #5 (permalink)  
Alt 15-12-2006, 16:50
tams
 Newbie
Links : Onlinestatus : tams ist offline
Registriert seit: Jan 2004
Beiträge: 24
tams ist zur Zeit noch ein unbeschriebenes Blatt
Standard

Heissen Dank Kropff,

habe ich schon versucht, leider ohne Auswirkungen. Muß noch anders gehen. Der IE interpretiert das irgendwie anders. Entweder ist die Grafik bei Firefox nicht richtig dran oder beim IE.

Gruß
Torsten

Geändert von tams (15-12-2006 um 16:54 Uhr)
Mit Zitat antworten
  #6 (permalink)  
Alt 15-12-2006, 17:00
Kropff
  Administrator
Links : Onlinestatus : Kropff ist offline
Registriert seit: Mar 2002
Ort: Köln
Beiträge: 11.757
Kropff befindet sich auf einem aufstrebenden Ast
Standard

also so sieht es bei mir in allen browsern gleich aus (ff 1.5 und 2, ie 6 und 7)
PHP-Code:
#barountenrechts {
margin-top0px;
padding-top20px;
padding-left623px;
}
/* IE 6*/
html #barountenrechts {
font-size0px;
}
/* IE 7*/
>body #barountenrechts {
padding-top10px;

peter
__________________
Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
Meine Seite

Geändert von Kropff (15-12-2006 um 17:15 Uhr)
Mit Zitat antworten
  #7 (permalink)  
Alt 15-12-2006, 17:12
tams
 Newbie
Links : Onlinestatus : tams ist offline
Registriert seit: Jan 2004
Beiträge: 24
tams ist zur Zeit noch ein unbeschriebenes Blatt
Standard

Hallo Kropff,

hmm irgendwie klappt das zwar nun mit IE 7 aber dummerweise sieht es bei Firefox 2.0 und Opera nun so aus:

Firefox 2.0

Sorry, weiß auch nicht was ich verkehrt mache. Habe Deinen Code doch genauso eingebaut:



Aber heissen Dank nochmals.

TorstenGecodete Site
Mit Zitat antworten
  #8 (permalink)  
Alt 15-12-2006, 17:14
Kropff
  Administrator
Links : Onlinestatus : Kropff ist offline
Registriert seit: Mar 2002
Ort: Köln
Beiträge: 11.757
Kropff befindet sich auf einem aufstrebenden Ast
Standard

bei mir nicht. hast du das padding-top auf 20px gesetzt?

peter
EDIT:
stimmt, 20px. da musst aber noch etwas geändert haben. jetzt klappt es auch bei mir nicht mehr
__________________
Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
Meine Seite

Geändert von Kropff (15-12-2006 um 17:17 Uhr)
Mit Zitat antworten
  #9 (permalink)  
Alt 15-12-2006, 17:17
tams
 Newbie
Links : Onlinestatus : tams ist offline
Registriert seit: Jan 2004
Beiträge: 24
tams ist zur Zeit noch ein unbeschriebenes Blatt
Standard

habe das eingebaut:

#barountenrechts {
margin-top: 0px;
padding-top: 20px;
padding-left: 623px;
font-size: 0px;
}
* html #barountenrechts {
font-size: 0px;
}
body #barountenrechts {
font-size: 0px;
padding-top: 10px;
}
Mit Zitat antworten
  #10 (permalink)  
Alt 15-12-2006, 17:22
Kropff
  Administrator
Links : Onlinestatus : Kropff ist offline
Registriert seit: Mar 2002
Ort: Köln
Beiträge: 11.757
Kropff befindet sich auf einem aufstrebenden Ast
Standard

komisch. schmeiss das padding-top raus und arbeite mit margin-top. dann klappt es auch. spiel ein wenig herum. du hast ja drei varianten für die browser

gruß
peter
__________________
Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
Meine Seite
Mit Zitat antworten
  #11 (permalink)  
Alt 15-12-2006, 17:22
tams
 Newbie
Links : Onlinestatus : tams ist offline
Registriert seit: Jan 2004
Beiträge: 24
tams ist zur Zeit noch ein unbeschriebenes Blatt
Standard

mach ich mal...
Mit Zitat antworten
  #12 (permalink)  
Alt 15-12-2006, 17:35
tams
 Newbie
Links : Onlinestatus : tams ist offline
Registriert seit: Jan 2004
Beiträge: 24
tams ist zur Zeit noch ein unbeschriebenes Blatt
Standard

Hmmm echt komisch, die Varianten zeigen bei mir irgendwie alle keine Wirkung. Habe das padding-top überall mal rausgeworfen und mit margin-top gespielt. hatte aber entweder nur Auswirkungen auf den IE oder Firefox/Opera. Langsam gebe ich auf. Muß wohl doch wieder mit tabellen arbeiten (seufz)...
Mit Zitat antworten
  #13 (permalink)  
Alt 15-12-2006, 17:38
Kropff
  Administrator
Links : Onlinestatus : Kropff ist offline
Registriert seit: Mar 2002
Ort: Köln
Beiträge: 11.757
Kropff befindet sich auf einem aufstrebenden Ast
Standard

das forum hat was verschluckt. vor das body #barountenrechts muss direkt ohne leerzeichen ein größer als also >body #barountenrechts

peter
__________________
Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
Meine Seite
Mit Zitat antworten
  #14 (permalink)  
Alt 15-12-2006, 17:56
tams
 Newbie
Links : Onlinestatus : tams ist offline
Registriert seit: Jan 2004
Beiträge: 24
tams ist zur Zeit noch ein unbeschriebenes Blatt
Standard

hmmm, gibt's doch nicht. So langsam glaub, daß was mit meinem Browsern nicht stimmt. Genau so hab ich es jetzt eingebaut:

#barountenrechts {
margin-top: 0px;
padding-top: 20px;
padding-left: 623px;
}
/* IE 6*/
* html #barountenrechts {
font-size: 0px;
}
/* IE 7*/
>body #barountenrechts {
padding-top: 10px;
}

Merkwürdigerweise wirken sich Änderungen an:
/* IE 6*/
* html #barountenrechts {
font-size: 0px;
}
/* IE 7*/
>body #barountenrechts {
padding-top: 10px;
}

in keinster Weise bei mir aus.

Einzig Änderungen an:

#barountenrechts {
margin-top: 0px;
padding-top: 20px;
padding-left: 623px;
}

scheinen sich auzuwirken. So wie es jetzt unter folgendem Link
gebaut ist:

Link zum Coding

klappt es auf dem PC nur unter Firefox 2.0 und Opera. Der blöde IE 7.0.5700 will einfach nicht. Solche Probleme sind der Grund warum ich immer noch viel mit Tabellen mache.

Muß nun mal eben kurz in die Autowerkstatt. Wenn ich zurück bin, mach ich weiter. Vielen Dank Dir erstmal!!!!

Geändert von tams (15-12-2006 um 18:01 Uhr)
Mit Zitat antworten
  #15 (permalink)  
Alt 15-12-2006, 18:15
Kropff
  Administrator
Links : Onlinestatus : Kropff ist offline
Registriert seit: Mar 2002
Ort: Köln
Beiträge: 11.757
Kropff befindet sich auf einem aufstrebenden Ast
Standard

PHP-Code:
>body #barountenrechts {
margin-top10px// MARGIN

peter
__________________
Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
Meine Seite
Mit Zitat antworten
Antwort

Lesezeichen


Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)
 

Themen-Optionen
Thema bewerten
Thema bewerten:

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 an


PHP News

PHP Marktplatz-Software
PHP Marktplatz-SoftwareEs hat sich viel getan! Die neue Version 7.5.9 unserer PHP Marktplatz-Software ebiz-trader steht ab sofort zur Verfügung.

28.10.2019 | Berni

Die RIGID-FLEX-Technologie
Die RIGID-FLEX-TechnologieDie sogenannte "Flexible Elektronik" , oftmals auch als "Flexible Schaltungen" bezeichnet, ist eine zeitgemäße Technologie zum Montieren von elektronischen Schaltungen.

06.12.2018 | Berni


 

Aktuelle PHP Scripte

SMT

Server Monitoring & Management Tool Das SMT wurde von einem Administrator für Administratoren entwickelt, es vereinfacht den Alltag in der klassischen Administration und Verwaltung. Mit dem SMT kannst Du alle Deine Server & Dienste verwalten und überwach

09.10.2020 palle_1977 | Kategorie: PHP
phplinX-Erotikportal 4 ansehen phplinX-Erotikportal 4

Erweiterbares Portal speziell für Erotik mit den Modulen Webkatalog, Bannermanagement und Kleinanzeigenmarkt. Sämtliche Module können über einen einzigen Adminbereich verwaltet werden.

18.06.2020 Cosinus14 | Kategorie: PHP/ Anzeigenmarkt
Erotik-Portal

Mit unsererem Erotik-Portal erhalten Sie ein komplettes Internetprojekt inklusive einer bedienerfreundlichem Administration sowie zahlreichen wichtigen Funktionen. Unser auf PHP und MySQL basierendes Script bietet Ihnen - und Ihren Besuchern - komfort

18.06.2020 ISD-Genthin | Kategorie: PHP/ Anzeigenmarkt
 Alle PHP Scripte anzeigen

Alle Zeitangaben in WEZ +2. Es ist jetzt 20:51 Uhr.