Problème menu css et php
ab1609
Messages postés
1
Date d'inscription
Statut
Membre
Dernière intervention
-
a70m Messages postés 2763 Date d'inscription Statut Contributeur Dernière intervention -
a70m Messages postés 2763 Date d'inscription Statut Contributeur Dernière intervention -
Bonjour,
J'ai téléchargé un template gratuit (provenance: freecsstemplates.org) que je souhaite utiliser pour afficher les résultats de mes requêtes sous phpmyadmin.
Le problème est que, lorsque j'insère du php dans mon template, le menu de gauche se retrouve alors en haut de la page. Je n'arrive vraiment pas à comprendre d'où vient le problème.
Le fichier css (style):
/*
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
*/
body {
margin: 0;
padding: 0;
background: #FFFDEA url(images/img01.jpg) repeat-x left top;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #464032;
}
h1, h2, h3 {
margin: 0;
padding: 0;
font-weight: normal;
color: #333333;
}
h1 {
font-size: 2em;
}
h2 {
font-size: 2.4em;
}
h3 {
font-size: 1.6em;
}
p, ul, ol {
margin-top: 0;
line-height: 180%;
}
ul, ol {
}
a {
text-decoration: none;
color: #9D151A;
}
a:hover {
}
#wrapper {
width: 960px;
margin: 0 auto;
padding: 0;
}
/* Header */
#header {
width: 940px;
height: 148px;
margin: 0 auto;
}
/* Logo */
#logo {
float: left;
height: 90px;
margin: 0;
background: url(images/img04.jpg) no-repeat left top;
padding-top: 30px;
color: #000000;
}
#logo h1, #logo p {
margin: 0;
padding: 0;
}
#logo h1 {
float: left;
padding-left: 120px;
letter-spacing: -1px;
text-transform: lowercase;
font-size: 3.8em;
}
#logo p {
float: left;
margin: 0;
padding: 26px 0 0 10px;
font: normal 14px Georgia, "Times New Roman", Times, serif;
font-style: italic;
color: #5E4E38;
}
#logo p a {
color: #5E4E38;
}
#logo a {
border: none;
background: none;
text-decoration: none;
color: #A83A01;
}
/* Search */
#search {
float: right;
width: 280px;
height: 60px;
padding: 20px 0px 0px 0px;
background: #E9E3CB;
border-bottom: 4px solid #FFFFFF;
}
#search form {
height: 41px;
margin: 0;
padding: 10px 0 0 20px;
}
#search fieldset {
margin: 0;
padding: 0;
border: none;
}
#search-text {
width: 170px;
padding: 6px 5px 2px 5px;
border: none;
background: #FFFFFF;
text-transform: lowercase;
font: normal 11px Arial, Helvetica, sans-serif;
color: #464032;
}
#search-submit {
width: 50px;
height: 23px;
border: 1px solid #AC9A79;
background: #AC9A79;
font-weight: bold;
font-size: 10px;
color: #FFFFFF;
}
/* Menu */
#menu {
width: 940px;
height: 36px;
margin: 0 auto;
padding: 0;
}
#menu ul {
margin: 0px 0px 0px 10px;
padding: 0;
list-style: none;
line-height: normal;
}
#menu li {
float: left;
}
#menu a {
display: block;
height: 26px;
margin-right: 2px;
margin-bottom: 10px;
padding: 10px 20px 0px 20px;
text-decoration: none;
text-align: center;
text-transform: uppercase;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: bold;
color: #FFFFFF;
border: none;
}
#menu a:hover, #menu .current_page_item a {
background: #FFFFFF;
text-decoration: none;
color: #333333;
}
#menu .current_page_item a {
background: #FFFFFF;
color: #333333;
}
/* Page */
#page {
width: 940px;
margin: 0 auto;
padding: 0;
}
#page-bgtop {
padding: 20px px;
}
#page-bgbtm {
}
/* Content */
#content {
float: right;
width: 620px;
padding: 30px 0px 0px 0px;
}
.post {
margin-bottom: 15px;
}
.post-bgtop {
}
.post-bgbtm {
}
.post .title {
margin-bottom: 10px;
padding: 12px 0 0 0px;
letter-spacing: -1px;
color: #000000;
}
.post .title a {
text-transform: lowercase;
color: #333333;
border: none;
}
.post .meta {
height: 30px;
background: url(images/img03.jpg) no-repeat left top;
margin: 0px;
padding: 0px 20px 0px 20px;
text-align: left;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-weight: bold;
}
.post .meta .date {
float: left;
height: 24px;
padding: 3px 0px;
color: #FFFFFF;
}
.post .meta .posted {
float: right;
height: 24px;
padding: 3px 15px;
border-left: 1px solid #FFFFFF;
color: #FFFFFF;
}
.post .meta a {
color: #FFFFFF;
}
.post .entry {
padding: 0px 0px 20px 0px;
padding-bottom: 20px;
text-align: justify;
}
.links {
padding-top: 20px;
font-size: 12px;
font-weight: bold;
}
/* Sidebar */
#sidebar {
float: left;
width: 280px;
padding: 0px;
color: #787878;
}
#sidebar ul {
margin: 0;
padding: 0;
list-style: none;
}
#sidebar li {
margin: 0;
padding: 0;
border-right: 1px solid #E9E3CB;
}
#sidebar li ul {
margin: 0px 0px;
padding-bottom: 30px;
}
#sidebar li li {
line-height: 35px;
border-bottom: 1px dotted #E5E0C6;
margin: 0px 30px;
border-right: none;
}
#sidebar li li span {
display: block;
margin-top: -20px;
padding: 0;
font-size: 11px;
font-style: italic;
}
#sidebar h2 {
background: url(images/img02.jpg) no-repeat left top;
padding-left: 30px;
padding-top: 6px;
padding-bottom: 6px;
letter-spacing: -.5px;
font-size: 16px;
font-weight: bold;
color: #FFFFFF;
}
#sidebar p {
margin: 0 0px;
padding: 10px 30px 20px 30px;
text-align: justify;
}
#sidebar a {
border: none;
color: #464032;
}
#sidebar a:hover {
text-decoration: underline;
color: #8A8A8A;
}
/* Calendar */
#calendar {
}
#calendar_wrap {
padding: 20px;
}
#calendar table {
width: 100%;
}
#calendar tbody td {
text-align: center;
}
#calendar #next {
text-align: right;
}
/* Footer */
#footer {
width: 940px;
height: 50px;
margin: 0 auto;
padding: 0px 0 15px 0;
border-top: 4px solid #EBE6D1;
font-family: Arial, Helvetica, sans-serif;
}
#footer p {
margin: 0;
padding-top: 20px;
line-height: normal;
font-size: 10px;
text-transform: uppercase;
text-align: center;
color: #444444;
}
#footer a {
color: #464032;
}
Je précise que si je suis relativement à l'aise avec MYSQL et PHP, mes connaissances en css sont nulles. Je signale également que les requêtes que j'utilise fonctionnent parfaitement, seule la mise en page est chaotique.
J'ai téléchargé un template gratuit (provenance: freecsstemplates.org) que je souhaite utiliser pour afficher les résultats de mes requêtes sous phpmyadmin.
Le problème est que, lorsque j'insère du php dans mon template, le menu de gauche se retrouve alors en haut de la page. Je n'arrive vraiment pas à comprendre d'où vient le problème.
Le fichier css (style):
/*
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
*/
body {
margin: 0;
padding: 0;
background: #FFFDEA url(images/img01.jpg) repeat-x left top;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #464032;
}
h1, h2, h3 {
margin: 0;
padding: 0;
font-weight: normal;
color: #333333;
}
h1 {
font-size: 2em;
}
h2 {
font-size: 2.4em;
}
h3 {
font-size: 1.6em;
}
p, ul, ol {
margin-top: 0;
line-height: 180%;
}
ul, ol {
}
a {
text-decoration: none;
color: #9D151A;
}
a:hover {
}
#wrapper {
width: 960px;
margin: 0 auto;
padding: 0;
}
/* Header */
#header {
width: 940px;
height: 148px;
margin: 0 auto;
}
/* Logo */
#logo {
float: left;
height: 90px;
margin: 0;
background: url(images/img04.jpg) no-repeat left top;
padding-top: 30px;
color: #000000;
}
#logo h1, #logo p {
margin: 0;
padding: 0;
}
#logo h1 {
float: left;
padding-left: 120px;
letter-spacing: -1px;
text-transform: lowercase;
font-size: 3.8em;
}
#logo p {
float: left;
margin: 0;
padding: 26px 0 0 10px;
font: normal 14px Georgia, "Times New Roman", Times, serif;
font-style: italic;
color: #5E4E38;
}
#logo p a {
color: #5E4E38;
}
#logo a {
border: none;
background: none;
text-decoration: none;
color: #A83A01;
}
/* Search */
#search {
float: right;
width: 280px;
height: 60px;
padding: 20px 0px 0px 0px;
background: #E9E3CB;
border-bottom: 4px solid #FFFFFF;
}
#search form {
height: 41px;
margin: 0;
padding: 10px 0 0 20px;
}
#search fieldset {
margin: 0;
padding: 0;
border: none;
}
#search-text {
width: 170px;
padding: 6px 5px 2px 5px;
border: none;
background: #FFFFFF;
text-transform: lowercase;
font: normal 11px Arial, Helvetica, sans-serif;
color: #464032;
}
#search-submit {
width: 50px;
height: 23px;
border: 1px solid #AC9A79;
background: #AC9A79;
font-weight: bold;
font-size: 10px;
color: #FFFFFF;
}
/* Menu */
#menu {
width: 940px;
height: 36px;
margin: 0 auto;
padding: 0;
}
#menu ul {
margin: 0px 0px 0px 10px;
padding: 0;
list-style: none;
line-height: normal;
}
#menu li {
float: left;
}
#menu a {
display: block;
height: 26px;
margin-right: 2px;
margin-bottom: 10px;
padding: 10px 20px 0px 20px;
text-decoration: none;
text-align: center;
text-transform: uppercase;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: bold;
color: #FFFFFF;
border: none;
}
#menu a:hover, #menu .current_page_item a {
background: #FFFFFF;
text-decoration: none;
color: #333333;
}
#menu .current_page_item a {
background: #FFFFFF;
color: #333333;
}
/* Page */
#page {
width: 940px;
margin: 0 auto;
padding: 0;
}
#page-bgtop {
padding: 20px px;
}
#page-bgbtm {
}
/* Content */
#content {
float: right;
width: 620px;
padding: 30px 0px 0px 0px;
}
.post {
margin-bottom: 15px;
}
.post-bgtop {
}
.post-bgbtm {
}
.post .title {
margin-bottom: 10px;
padding: 12px 0 0 0px;
letter-spacing: -1px;
color: #000000;
}
.post .title a {
text-transform: lowercase;
color: #333333;
border: none;
}
.post .meta {
height: 30px;
background: url(images/img03.jpg) no-repeat left top;
margin: 0px;
padding: 0px 20px 0px 20px;
text-align: left;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-weight: bold;
}
.post .meta .date {
float: left;
height: 24px;
padding: 3px 0px;
color: #FFFFFF;
}
.post .meta .posted {
float: right;
height: 24px;
padding: 3px 15px;
border-left: 1px solid #FFFFFF;
color: #FFFFFF;
}
.post .meta a {
color: #FFFFFF;
}
.post .entry {
padding: 0px 0px 20px 0px;
padding-bottom: 20px;
text-align: justify;
}
.links {
padding-top: 20px;
font-size: 12px;
font-weight: bold;
}
/* Sidebar */
#sidebar {
float: left;
width: 280px;
padding: 0px;
color: #787878;
}
#sidebar ul {
margin: 0;
padding: 0;
list-style: none;
}
#sidebar li {
margin: 0;
padding: 0;
border-right: 1px solid #E9E3CB;
}
#sidebar li ul {
margin: 0px 0px;
padding-bottom: 30px;
}
#sidebar li li {
line-height: 35px;
border-bottom: 1px dotted #E5E0C6;
margin: 0px 30px;
border-right: none;
}
#sidebar li li span {
display: block;
margin-top: -20px;
padding: 0;
font-size: 11px;
font-style: italic;
}
#sidebar h2 {
background: url(images/img02.jpg) no-repeat left top;
padding-left: 30px;
padding-top: 6px;
padding-bottom: 6px;
letter-spacing: -.5px;
font-size: 16px;
font-weight: bold;
color: #FFFFFF;
}
#sidebar p {
margin: 0 0px;
padding: 10px 30px 20px 30px;
text-align: justify;
}
#sidebar a {
border: none;
color: #464032;
}
#sidebar a:hover {
text-decoration: underline;
color: #8A8A8A;
}
/* Calendar */
#calendar {
}
#calendar_wrap {
padding: 20px;
}
#calendar table {
width: 100%;
}
#calendar tbody td {
text-align: center;
}
#calendar #next {
text-align: right;
}
/* Footer */
#footer {
width: 940px;
height: 50px;
margin: 0 auto;
padding: 0px 0 15px 0;
border-top: 4px solid #EBE6D1;
font-family: Arial, Helvetica, sans-serif;
}
#footer p {
margin: 0;
padding-top: 20px;
line-height: normal;
font-size: 10px;
text-transform: uppercase;
text-align: center;
color: #444444;
}
#footer a {
color: #464032;
}
Je précise que si je suis relativement à l'aise avec MYSQL et PHP, mes connaissances en css sont nulles. Je signale également que les requêtes que j'utilise fonctionnent parfaitement, seule la mise en page est chaotique.
A voir également:
- Problème menu css et php
- Menu déroulant excel - Guide
- Easy php - Télécharger - Divers Web & Internet
- Canon quick menu - Télécharger - Utilitaires
- Windows 11 menu contextuel classique - Guide
- Windows 11 menu démarrer classique - Guide