Witam,
chciałbym zrobić tak jak na home.pl że zastosowanie i spowoduje listę, ale nie pod sobą tylko jeden obok drugiego.
Oto kawałek źródła strony home.pl:
home.pl
Konto
Poczta
Moje usługi
Kreator WWW
Rejestruj
Zaloguj
a to ich css:
/* top1 */
#top1 {
position: relative;
width: 940px;
margin: 0 auto;
text-align: left;
height: 60px;
}
h1 {
position: absolute;
top: 10px;
left: 25px;
width: 142px;
height: 40px;
margin: 0;
overflow: hidden;
}
h1 span {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url('/gfx-new/img/home_logo.gif') no-repeat 0 0;
}
#topPanel {
position: absolute;
right: 25px;
top: 9px;
margin: 0;
padding: 0;
font-size: 10px;
list-style: none;
}
#topPanel li {
float: left;
}
#topPanel a {
color: #888;
text-decoration: none;
}
#topPanel a:hover {
color:#888;
text-decoration: underline;
}
#topPanel1, #topPanel2, #topPanel3, #topPanel4login, #topPanel4logout, #topPanel5, #topPanel6 {
float: left;
margin-left: 25px;
padding-top: 32px;
min-width: 32px;
text-align: center;
white-space: nowrap;
}
#topPanel6 {
margin-left: 50px;
}
#topPanel1 {
background: url('/gfx/icon-setup.gif') no-repeat center 0;
}
#topPanel2 {
background: url('/gfx/icon-webmail.gif') no-repeat center 0;
}
#topPanel3 {
background: url('/gfx/icon-manager.gif') no-repeat center 0;
}
#topPanel4login {
background: url('/gfx/icon-login.gif') no-repeat center 0;
}
#topPanel4logout {
background: url('/gfx/icon-logout.gif') no-repeat center 0;
}
#topPanel5 {
background: url('/gfx/icon-webcreator.gif') no-repeat center 0;
}
#topPanel6 {
background: url('/gfx/icon-register.gif') no-repeat center 0;
}
Zrobiłem podobnie na mojej stronie i nie działa. Nadal mam jedno pod drugim. Możecie powiedzieć mi co powoduje to że one są jeden obok drugiego a nie jeden pod drugim?
A oto mój kod:
Kontakt
Zamowienia
Biuletyn
a to css:
#topMenu
{
position: relative;
top:83px;
height: 20px;
background: #808080;
}
#topPanel
{
position: absolute;
top: 3px;
right: 10px;
margin: 0;
padding: 0;
font: 10px Verdana;
list-style: none;
}
#topPanel
{
float: left;
}
#topPanel a
{
color: #FFFFFF;
text-decoration: none;
}
#topPanel a:hover
{
background: #000000;
}
#topPanel1, #topPanel2, #topPanel3
{
float: left;
margin-left: 20px;
min-width: 32px;
text-align: center;
white-space: nowrap;
}
Pozdrawiamfrom Księga informacji!
Witam,
chciałbym zrobić tak jak na home.pl że zastosowanie i spowoduje listę, ale nie pod sobą tylko jeden obok drugiego.
Oto kawałek źródła strony home.pl:
home.pl
Konto
Poczta
Moje usługi
Kreator WWW
Rejestruj
Zaloguj
a to ich css:
/* top1 */
#top1 {
position: relative;
width: 940px;
margin: 0 auto;
text-align: left;
height: 60px;
}
h1 {
position: absolute;
top: 10px;
left: 25px;
width: 142px;
height: 40px;
margin: 0;
overflow: hidden;
}
h1 span {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url('/gfx-new/img/home_logo.gif') no-repeat 0 0;
}
#topPanel {
position: absolute;
right: 25px;
top: 9px;
margin: 0;
padding: 0;
font-size: 10px;
list-style: none;
}
#topPanel li {
float: left;
}
#topPanel a {
color: #888;
text-decoration: none;
}
#topPanel a:hover {
color:#888;
text-decoration: underline;
}
#topPanel1, #topPanel2, #topPanel3, #topPanel4login, #topPanel4logout, #topPanel5, #topPanel6 {
float: left;
margin-left: 25px;
padding-top: 32px;
min-width: 32px;
text-align: center;
white-space: nowrap;
}
#topPanel6 {
margin-left: 50px;
}
#topPanel1 {
background: url('/gfx/icon-setup.gif') no-repeat center 0;
}
#topPanel2 {
background: url('/gfx/icon-webmail.gif') no-repeat center 0;
}
#topPanel3 {
background: url('/gfx/icon-manager.gif') no-repeat center 0;
}
#topPanel4login {
background: url('/gfx/icon-login.gif') no-repeat center 0;
}
#topPanel4logout {
background: url('/gfx/icon-logout.gif') no-repeat center 0;
}
#topPanel5 {
background: url('/gfx/icon-webcreator.gif') no-repeat center 0;
}
#topPanel6 {
background: url('/gfx/icon-register.gif') no-repeat center 0;
}
Zrobiłem podobnie na mojej stronie i nie działa. Nadal mam jedno pod drugim. Możecie powiedzieć mi co powoduje to że one są jeden obok drugiego a nie jeden pod drugim?
A oto mój kod:
Kontakt
Zamowienia
Biuletyn
a to css:
#topMenu
{
position: relative;
top:83px;
height: 20px;
background: #808080;
}
#topPanel
{
position: absolute;
top: 3px;
right: 10px;
margin: 0;
padding: 0;
font: 10px Verdana;
list-style: none;
}
#topPanel
{
float: left;
}
#topPanel a
{
color: #FFFFFF;
text-decoration: none;
}
#topPanel a:hover
{
background: #000000;
}
#topPanel1, #topPanel2, #topPanel3
{
float: left;
margin-left: 20px;
min-width: 32px;
text-align: center;
white-space: nowrap;
}
Pozdrawiam