Webwereld

CSS Vraag

Gestart doorDaan5 reacties32 weergaven
Log in om mee te praten

6 berichten · pagina 1 van 1

Daan

Lid · Topicstarter

Berichten
692
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
Hallo,

Ik heb een template gedownload van onze liefste Marjolein (shiny) op KFB-Design.nl.
Alleen nu heb ik één klein probleempje, zoals je ziet op: http://daan.s3.one2xs.com/bestel/index.php
Loopt het menu ietsjes te ver door, hoe los ik dit op? En in IE bugt de layout ook echt enorm! Alleen dat kan in evt zelf wel fixen later, maar als jij hier een oplossing voor hebt ben je welkom.

Alvast bedankt,
Daan
0
One2xs

Bot

Berichten
93.699
Reputatie
0
Punten
1,27
Lid sinds
Laatst gezien
width kleiner maken, en eventueel de margin lager maken.
0
Daan

Lid · Topicstarter

Berichten
692
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
Ik heb nu dit, en wat nu? En waarom is het als ik van index naar -> bestellen ga dat de layout opschuift?
0
Wdbs

Lid

Berichten
2.512
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
Om eerlijk te zijn vind ik het wel mooi. Zo geeft het wat meer diepte in het menu. Als je even je css post dan help ik je.
0
Daan

Lid · Topicstarter

Berichten
692
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
Spoiler tonen
/* CSS Document */
/* Layout gemaakt door: Marjolein/*

/* main */
body {margin: 0; padding: 0; font-family: Verdana, Tahoma, arial; font-size: 11px; color: #010101; width: 100%; height: 100%;    
background-color: #010101; background-image:  url(images/site_bg.png); background-repeat:repeat-x;}

#container { width: 617px; margin: 0 auto;}
#header {width: 617px; height: 84px; background-image:  url(images/header.png);}
#header #right {width: 200px; height: 50px; float:right; margin-top: 20px; margin-right: 20px; }
#header h1 {color: #f4812c; font-size: 25px; font-weight: normal; padding: 20px 0 0 100px; margin:0;}
#header h2 {color: #010101; font-size: 10px; font-weight: normal; padding: 0 0 0 100px; margin:0;}

#menu {width: 617px; padding: 0; margin: 0; height: 39px; background-image:  url(images/menu.png);}
#menu ul { list-style: none; margin:0; padding-top: 10px;}
#menu ul li {float: left; padding-left: 30px;} 
#menu ul li a { display: block-inline; text-decoration: none; padding:15px 5px 0 5px; color:#7b7b7b;}
#menu ul li a:hover {border-bottom: 1px dotted #555555; color:#555555;}

#main {width: 617px; padding: 0; margin: 0; background-image:  url(images/main_bg.png); overflow:hidden;}
#content {width: 580px; margin: 0 auto;}
#content h3 {font-size: 12px; color:#f4812c;}

.space {height: 10px;}
#footer {width: 617px; height: 50px; background-image: url(images/footer.png); margin:0; padding:0;}
#bottom {width: 617px; height: 40px; margin:0; padding-top: 15px;}
#bottom h5 {font-size: 10px; color:#d8dee0; padding:0; margin:0; text-align:center;}

img { border:none;}

/* menu items */                                        
a {font-family:Verdana, Tahoma, arial; font-size:10px; color:#f4812c; text-decoration: none;}
a:hover {font-family:Verdana, Tahoma, arial; font-size:10px; color:faaf6b;}

/* The *normal* state styling */
.btn{
background-image:linear-gradient(-90deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.2));
    background-image:-webkit-gradient(linear, left top, left bottom,color-stop(0%, rgba(255, 255, 255, 0.1)), color-stop(100%, rgba(255, 255, 255, 0.2)));
    background-image:-moz-linear-gradient(-90deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.2));
    filter:progid:DXImageTransform.Microsoft.gradient(startColorStr=#10ffffff, EndColorStr=#20ffffff);
    -ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorStr=#10ffffff, EndColorStr=#20ffffff)";
    background-color:rgb(255, 255, 255);
    border:1px dashed rgb(16, 0, 0);
    border-radius:0;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    padding:2px;
    box-shadow:0px 0px 0px rgb(6, 0, 0);
    -moz-box-shadow:0px 0px 0px rgb(6, 0, 0);
    -webkit-box-shadow:0px 0px 0px rgb(6, 0, 0);
    font-size:11px;
    font-weight:normal;
    color:rgb(0, 0, 0);
    text-shadow:1px 1px 1px rgba(0, 0, 0, 0);
}
/* The *hover* state styling */
.btn:hover{
    border:1px solid rgb(16, 0, 0);
}

/* The *active* state styling */
.btn:active,.btn:focus{
    border:1px dashed rgb(16, 0, 0);
}


/* The *normal* state styling */
.btn2{
background-image:linear-gradient(-90deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.2));
    background-image:-webkit-gradient(linear, left top, left bottom,color-stop(0%, rgba(255, 255, 255, 0.1)), color-stop(100%, rgba(255, 255, 255, 0.2)));
    background-image:-moz-linear-gradient(-90deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.2));
    filter:progid:DXImageTransform.Microsoft.gradient(startColorStr=#10ffffff, EndColorStr=#20ffffff);
    -ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorStr=#10ffffff, EndColorStr=#20ffffff)";
    background-color:rgb(255, 255, 255);
    border:1px dashed rgb(16, 0, 0);
    border-radius:0;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    padding:2px;
    box-shadow:0px 0px 0px rgb(6, 0, 0);
    -moz-box-shadow:0px 0px 0px rgb(6, 0, 0);
    -webkit-box-shadow:0px 0px 0px rgb(6, 0, 0);
    font-size:11px;
    font-weight:bold;
    color:rgb(0, 0, 0);
    text-shadow:1px 1px 1px rgba(0, 0, 0, 0);
}
/* The *hover* state styling */
.btn:hover{
    border:1px solid rgb(16, 0, 0);
}

/* The *active* state styling */
.btn:active,.btn:focus{
    border:1px dashed rgb(16, 0, 0);
}
0
Wdbs

Lid

Berichten
2.512
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
/* CSS Document */
/* Layout gemaakt door: Marjolein/*

/* main */
body {margin: 0; padding: 0; font-family: Verdana, Tahoma, arial; font-size: 11px; color: #010101; width: 100%; height: 100%;    
background-color: #010101; background-image:  url(images/site_bg.png); background-repeat:repeat-x;}

#container { width: 617px; margin: 0 auto;}
#header {width: 617px; height: 84px; background-image:  url(images/header.png);}
#header #right {width: 200px; height: 50px; float:right; margin-top: 20px; margin-right: 20px; }
#header h1 {color: #f4812c; font-size: 25px; font-weight: normal; padding: 20px 0 0 100px; margin:0;}
#header h2 {color: #010101; font-size: 10px; font-weight: normal; padding: 0 0 0 100px; margin:0;}

#menu {width: 617px; padding: 0; margin: 0; height: 39px; background-image:  url(images/menu.png);}
#menu ul { list-style: none; margin:0; padding-top: 10px;}
#menu ul li {float: left; padding-left: 30px;} 
#menu ul li a { display: block-inline; text-decoration: none; padding:15px 5px 0 5px; color:#7b7b7b;}
#menu ul li a:hover {border-bottom: 1px dotted #555555; color:#555555;}

#main {width: 616px; padding: 0; margin: 0; background-image:  url(images/main_bg.png); overflow:hidden;}
#content {width: 580px; margin: 0 auto;}
#content h3 {font-size: 12px; color:#f4812c;}

.space {height: 10px;}
#footer {width: 617px; height: 50px; background-image: url(images/footer.png); margin:0; padding:0;}
#bottom {width: 617px; height: 40px; margin:0; padding-top: 15px;}
#bottom h5 {font-size: 10px; color:#d8dee0; padding:0; margin:0; text-align:center;}

img { border:none;}

/* menu items */                                        
a {font-family:Verdana, Tahoma, arial; font-size:10px; color:#f4812c; text-decoration: none;}
a:hover {font-family:Verdana, Tahoma, arial; font-size:10px; color:faaf6b;}

/* The *normal* state styling */
.btn{
background-image:linear-gradient(-90deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.2));
    background-image:-webkit-gradient(linear, left top, left bottom,color-stop(0%, rgba(255, 255, 255, 0.1)), color-stop(100%, rgba(255, 255, 255, 0.2)));
    background-image:-moz-linear-gradient(-90deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.2));
    filter:progid:DXImageTransform.Microsoft.gradient(startColorStr=#10ffffff, EndColorStr=#20ffffff);
    -ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorStr=#10ffffff, EndColorStr=#20ffffff)";
    background-color:rgb(255, 255, 255);
    border:1px dashed rgb(16, 0, 0);
    border-radius:0;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    padding:2px;
    box-shadow:0px 0px 0px rgb(6, 0, 0);
    -moz-box-shadow:0px 0px 0px rgb(6, 0, 0);
    -webkit-box-shadow:0px 0px 0px rgb(6, 0, 0);
    font-size:11px;
    font-weight:normal;
    color:rgb(0, 0, 0);
    text-shadow:1px 1px 1px rgba(0, 0, 0, 0);
}
/* The *hover* state styling */
.btn:hover{
    border:1px solid rgb(16, 0, 0);
}

/* The *active* state styling */
.btn:active,.btn:focus{
    border:1px dashed rgb(16, 0, 0);
}


/* The *normal* state styling */
.btn2{
background-image:linear-gradient(-90deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.2));
    background-image:-webkit-gradient(linear, left top, left bottom,color-stop(0%, rgba(255, 255, 255, 0.1)), color-stop(100%, rgba(255, 255, 255, 0.2)));
    background-image:-moz-linear-gradient(-90deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.2));
    filter:progid:DXImageTransform.Microsoft.gradient(startColorStr=#10ffffff, EndColorStr=#20ffffff);
    -ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorStr=#10ffffff, EndColorStr=#20ffffff)";
    background-color:rgb(255, 255, 255);
    border:1px dashed rgb(16, 0, 0);
    border-radius:0;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    padding:2px;
    box-shadow:0px 0px 0px rgb(6, 0, 0);
    -moz-box-shadow:0px 0px 0px rgb(6, 0, 0);
    -webkit-box-shadow:0px 0px 0px rgb(6, 0, 0);
    font-size:11px;
    font-weight:bold;
    color:rgb(0, 0, 0);
    text-shadow:1px 1px 1px rgba(0, 0, 0, 0);
}
/* The *hover* state styling */
.btn:hover{
    border:1px solid rgb(16, 0, 0);
}

/* The *active* state styling */
.btn:active,.btn:focus{
    border:1px dashed rgb(16, 0, 0);
}
0

Jouw reactie

Deel je idee, stel een vraag of help een ander verder.

Editor laden…

Praat mee met de One2xs-community.

Inloggen om te reageren