Anpassung vom Men?? - HTML, CSS, PHP & Co. - cms2day Forum - Community & Support rund ums cms2day

Fortgeschrittener

Dienstag, 27. Januar 2009, 20:15

Anpassung vom Menü

Hallo,

also krieg das alle bisher gut hin.. hab das Theme "Query" und habs ein bisschen angepasst.. !
Nun mein Problem.. Ich will das die Buttons im Menü einen kleinen Abstand haben.. kann mir das jemand machen ?

Meine Seite: <a class="postlink" href="http://www.ricodetjen.de/homepage">www.ricodetjen.de/homepage</a>

LG R!C

Zum Seitenanfang

netcup|Alex

unregistriert

2

Dienstag, 27. Januar 2009, 21:19

Re: Anpassung vom Menü

Du betreibst ein Webdesignportal und sprichst von professionalität und sauberem Code aber weiss nicht was padding und margin sind?

Zum Seitenanfang

Rico

Fortgeschrittener

Beiträge: 253

3

Dienstag, 27. Januar 2009, 21:32

Re: Anpassung vom Menü

Doch klar... aber mein "Kollege" der ist eig. für das Coden zuständig..... ein bisschen CSS und HTML aber geht das so einfach wie du sagst ? :lol:

Wenn ja !? :oops:

LG R!C

Zum Seitenanfang

netcup|Alex

unregistriert

4

Dienstag, 27. Januar 2009, 22:28

Re: Anpassung vom Menü

ul#menu li { margin-bottom:5px; }

Zum Seitenanfang

Rico

Fortgeschrittener

Beiträge: 253

5

Mittwoch, 28. Januar 2009, 18:02

Re: Anpassung vom Menü

Danke ! Werds mal probieren..

LG R!C

Zum Seitenanfang

Rico

Fortgeschrittener

Beiträge: 253

6

Mittwoch, 28. Januar 2009, 18:28

Re: Anpassung vom Menü

Dumme Frage, aber wo genau kommt es in die main.css ? Beim Menü hab ich es ausprobiert, es geht aber irgendwie nicht.. :oops:

Inhalt der Main.css:

/* - MISC STYLE - */

* {

margin: 0px;
padding: 0px;

}

html {

background: #DADBDD;
text-align: center;
width: 100%;
height: 100%;

}

body {

width: 100%;
background: #DADBDD;
font-size: 11px;
line-height: 18px;
color: #545248;
font-family: "Verdana", "Tahoma" , "Arial" , "MS Sans Serif";
margin: 0px auto;
text-align: left;
height: 100%;

}

td {

font-size: 11px;
line-height: 18px;
font-family: "Verdana", "Tahoma" , "Arial" , "MS Sans Serif";

}

ul {

margin: 0px;
padding: 0px;

}

li {

list-style: none;

}

form {

margin: 0px;
padding: 0px;

}

img {

border: none;

}

#cleaner {

clear: both;
height: 0px;
font-size: 0px;
display: block;
width: 100%;

}

a {

color: #e96000;
text-decoration: none;

}

a:hover {

color: #e96000;
text-decoration: underline;

}

/* - LAYER + CONTAINER - */

#layer {

width: 777px;
position: relative;
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0px auto;

}

#container {

padding-bottom: 41px;

}

/* - HEADER - */

#header {

width: 511px;
height: 105px;
background: #fff url(../images/header.gif) no-repeat;
margin: 0px 0px 0px 0px;
padding: 0px 20px 0px 246px;
text-align: left;
overflow: hidden;
position: relative;

}

#header table tr td {

padding: 0px;

}

#header table tr td #logo {

max-width: 300px;
overflow: hidden;

}

/* - SUBHEADER - */

#text #subheader {

width: 551px;
height: 224px;
margin: 0px;
padding: 0px;
text-align: left;
overflow: hidden;
background: url(../images/header.jpg);
position: relative;
}

#text #subheader img {

position: absolute;
width: 551px;
height: 32px;
z-index: 0;
left: 0px;
right: 0px;
bottom: 0px;

}

#text #subheader #seite {

width: 531px;
height: 32px;
line-height: 30px;
padding: 0px 0px 0px 20px;
position: absolute;
z-index: 1;
left: 0px;
right: 0px;
bottom: 0px;
overflow: hidden;
color: #4a4d54;

}

#timedate {

width: 200px;
height: 30px;
line-height: 30px;
padding: 0px 0px 0px 20px;
position: absolute;
z-index: 1;
left: 320px;
right: 0px;
bottom: 1px;
overflow: hidden;
color: #4a4d54;

}

#text #subheader #seite a {

text-decoration: underline;
color: #4a4d54;

}

#text #subheader #seite a:hover {

text-decoration: none;
color: #4a4d54;

}

/* - CONTENT - */

#content {

width: 777px;
margin: 0px;
padding: 0px;
text-align: left;
overflow: hidden;
background: transparent;
color: #545248;

}

/* - SIDEBAR - */

#content #sidebar {

width: 226px;
margin: 0px;
padding: 0px;
text-align: center;
overflow: hidden;
background:#e96000;
color: #fff;
float: left;
}

/* - FULL MENU - */

#content #sidebar #fullmenu {

width: 226px;
margin: 0px 0px 0px 0px;
padding: 0px;
text-align: left;

}

#content #sidebar #fullmenu ul {

width: 226px;
margin: 0px;
padding: 0px;

}

#content #sidebar #fullmenu ul li {

width: 226px;
height: 32px;
margin: 0px;
padding: 0;

overflow: hidden;
}

#content #sidebar #fullmenu ul li.submenu {

width: 226px;
height: auto;
margin: 0px;
padding: 0px;

}

#content #sidebar #fullmenu ul li a {

width: 162px !important;
height: 32px;
padding: 0px 32px !important;
text-decoration: none;
text-transform:uppercase;
color: #fff;
line-height: 32px;
display: block;
background: #e96000;
font-size: 10px;
text-align:right;

}

#content #sidebar #fullmenu ul li a:hover {
text-decoration: none;
color: #fff;
background: url(../images/menu_hover.gif) !important;
font-size: 10px;

}

#content #sidebar #fullmenu ul li a.aktiv, #content #sidebar #fullmenu ul li a:hover.aktiv {

width: 194px;
height: 32px;
padding: 0px 32px;
text-decoration: none;
color: #fff;
line-height: 32px;
display: block;
background: url(../images/menu_aktiv.gif) !important;
font-size: 10px;

}

#content #sidebar #fullmenu ul li.submenu ul li {

width: 226px;
height: 32px;
margin: 0px;
padding: 0px;
overflow: hidden;

}

#content #sidebar #fullmenu ul li.submenu ul li a {

width: 186px;
height: 32px;
padding: 0px 20px;
text-decoration: none;
color: #fff;
line-height: 32px;
display: block;
background: #4a4d54;
font-size: 10px;

}

#content #sidebar #fullmenu ul li.submenu ul li a:hover {

width: 186px;
height: 32px;
padding: 0px 20px;
text-decoration: none;
color: #fff !important;
line-height: 32px;
display: block;
background: url(../images/submenu_hover.gif) repeat-x !important;
font-size: 10px;

}

#content #sidebar #fullmenu ul li.submenu ul li a.aktiv, #content #sidebar #fullmenu ul li.submenu ul li a.aktiv:hover {

width: 186px;
height: 32px;
padding: 0px 20px;
text-decoration: none;
color: #fff !important;
line-height: 32px;
display: block;
background: url(../images/submenu_aktiv.gif) !important;
font-size: 10px;

}

/* - MENU - */

#content #sidebar #menu {

width: 226px;
margin: 0px 0px 0px 0px;
padding: 0px;
text-align: left;

}

#content #sidebar #menu ul {

width: 226px;
margin: 0px;
padding: 0px;

}

#content #sidebar #menu ul li {

width: 226px;
height: 32px;
margin: 0px;
padding: 0;
overflow: hidden;
}

#content #sidebar #menu ul li a {

width: 162px !important;
height: 32px;
padding: 0px 32px !important;
text-decoration: none;
text-transform:uppercase;
color: #fff;
line-height: 32px;
display: block;
background: #e96000;
font-size: 10px;
text-align: right;

}

#content #sidebar #menu ul li a:hover {

text-decoration: none;
color: #fff;
background: url(../images/menu_hover.gif) !important;
font-size: 10px;

}

#content #sidebar #menu ul li a.aktiv, #content #sidebar #menu ul li a:hover.aktiv {

width: 194px;
height: 32px;
padding: 0px 32px;
text-decoration: none;
color: #fff;
line-height: 32px;
display: block;
background: url(../images/menu_aktiv.gif) !important;
font-size: 10px;

}

/* - SUBMENU - */

#content #sidebar #submenu {

width: 226px;
height: auto;
margin: 0px;
padding: 0px;

}

#content #sidebar #submenu ul li {

width: 226px;
height: 32px;
margin: 0px;
padding: 0px;

overflow: hidden;
text-align: right;

}

#content #sidebar #submenu ul li a {

width: 162px !important;
height: 32px;
padding: 0px 32px !important;
text-decoration: none;
text-transform: uppercase;
color: #fff;
line-height: 32px;
display: block;
background: #4A4D54;
font-size: 10px;
text-align: right;

}

#content #sidebar #submenu ul li a:hover {

width: 162px !important;
height: 32px;
padding: 0px 32px !important;
text-decoration: none;
text-transform: uppercase;
color: #fff;
line-height: 32px;
display: block;
background: #4A4D54;
font-size: 10px;
text-align: right;
background: url(../images/submenu_hover.gif) repeat-x !important;

}

#content #sidebar #submenu ul li a.aktiv, #content #sidebar #submenu ul li a.aktiv:hover {

width: 162px !important;
height: 32px;
padding: 0px 32px !important;
text-decoration: none;
text-transform: uppercase;
color: #fff;
line-height: 32px;
display: block;
background: #4A4D54;
font-size: 10px;
text-align: right;
background: url(../images/submenu_aktiv.gif) !important;

}

/* - CMS CONTENT - */

#content #inhalt {

padding: 20px 20px 10px 20px;

}

#content #text {

width: 551px;
margin: 0px;
padding: 0;
text-align: justify;
background: #fff;
color: #545248;
float: left;
line-height: 22px;

}

/* - HTML ELEMENT STYLESHEET - */

#content #text h1 {

font-size: 18px;
font-weight: 400;
margin: 0px 0px 20px 0px;
color: #E96000;
font-family: Helvetica, Arial, sans-serif;
text-transform: none;
letter-spacing: 0px;

}

#content #text h2 {

font-size: 14px;
font-weight: bold;
margin: 0px 0px 15px 0px;
color: #545248;
font-family: "Arial";
text-transform: none;
letter-spacing: 0px;

}

#content #text h3 {

font-size: 11px;
font-weight: bold;
margin: 0px 0px 5px 0px;
color: #E96000;
font-family: "Verdana";
letter-spacing: 0px;

}

#content #text p {

margin: 0px 0px 15px 0px;

}

#content #text hr {

border-top: 1px solid #D7D7D7;
border-right: 1px solid #fff;
border-left: 1px solid #fff;
border-bottom: 1px solid #fff;
margin: 0px 0px 15px 0px;
height: 2px;

}

#content #text a {

color: #e96000;
text-decoration: underline;

}

#content #text a:hover {

color: #e96000;
text-decoration: none;

}

#content #text ul {

margin: 0px 0px 0px 15px;

}

#content #text ul li {

list-style: square;
line-height: 22px;

}

#content #text ul li ul li {

list-style: square;
line-height: 22px;
margin: 0px 0px 0px 5px;

}

/* - FOOTER - */

#footer {

width: 511px;
height: 30px;
margin: 0px;
padding: 0 20px;
text-align: left;
overflow: hidden;
color: #fff;
font-size: 10px;
line-height: 37px;
background: #4a4d54;
bottom: 0 !important;
height: 41px;

}

#footer a.seitenanfang {

float: right;
color: #fff !important;

}

#footer span {

float: left;

}

#footer a {

text-decoration: none;
color: #fff;
font-size: 10px;

}

#footer a:hover {

text-decoration: underline;
color: #fff;
font-size: 10px;

}

#footer a.w3b {

text-decoration: none;
color: #fff !important;
font-weight: bold;
font-size: 10px;

}

#footer a:hover.w3b {

text-decoration: underline;
color: #fff !important;
font-weight: bold;
font-size: 10px;

}

LG R!C

Zum Seitenanfang

netcup|Alex

unregistriert

7

Mittwoch, 28. Januar 2009, 18:47

Re: Anpassung vom Menü

einfach am Ende einfügen z.B.

<a class="postlink" href="http://www.css4you.de">www.css4you.de</a>

Zum Seitenanfang

Rico

Fortgeschrittener

Beiträge: 253

8

Mittwoch, 28. Januar 2009, 18:57

Re: Anpassung vom Menü

Bin zu dumm dafür.. krieg das net hin.. :oops:

:cry: :x

LG

Zum Seitenanfang

Rico

Fortgeschrittener

Beiträge: 253

9

Donnerstag, 29. Januar 2009, 16:17

Re: Anpassung vom Menü

@netcup|Alex: Kannst du mir nochmal richtig helfen ? Werde daraus nicht schlau..

LG R!C

Zum Seitenanfang

netcup|Alex

unregistriert

10

Donnerstag, 29. Januar 2009, 17:17

Re: Anpassung vom Menü

Nö, wie per PN gesagt find ich das unmöglich. Als "professioneller Webdesigner" auftreten und dann sowas :roll:
Google & css4you.de haben alles was du brauchst... stell dich nicht so an.

Zum Seitenanfang