PDA

Zobacz pełną wersję : Wyśrodkowanie - nie działa?



bo0L
01-02-2008, 10:44
Witam mam problem z wyśrodkowaniem artykulów oraz materiałów statycznych na mojej stronie. W edytorze wszytko jest okej - tekst jest wyśrodkowany w żrogle widać jak "wół" że div ma parametr center - jednak na stronie tekst nadal trzyma się kurczowo lewej krawędzi. Próbowałem już nawet na sztywno dodawać styl do mainbody, ale jedyne co się zmieniło to wyśrodkowanie przycisku "wstecz".

Może coś nie tak jest w kodzie? Tak jakby jakaś nadrzędna klasa blokowała ustawienie tekstu. Najciekawsze jest to że np. obrazki wyśrodkowuje bez problemu, większa ilość tekstu również wygląda na wyśrodkowaną, problem pojawia się przy krótkich wpisach.

adres strony http://tcpromo.pl/joomla/index.php


plik css:


body {
/* Opera5-Fix-fix ;-) background-image: url(/joomla/templates/tutorial/images/07.gif);*/
color: #000;
margin: 0;
padding: 0;
background-image: url(/joomla/templates/tutorial/images/bg.gif);
}

#top {
margin:0 auto;
width: 1024px;
height: 768px;
min-width: 1024px;
max-height: 768px;
}

#naglowek {
height: 234px;
width: 1024px;
max-width: 1024px;
overflow: hidden;
/* background-image: url(/joomla/templates/tutorial/images/01.gif); */
}

#menu {
width: 233px;
height: 492px;
max-width: 233px;
overflow: hidden;
background-image: url(/joomla/templates/tutorial/images/02.gif);
float: left;

}

#menutab {
margin-top: 120px;
margin-left: 40px;
}

#tresc {
background-image: url(/joomla/templates/tutorial/images/03.gif);
height: 492px;
width: 770px;
float: left;
overflow: auto;
max-width: 770px;
}


#tresc1 {

color: White;
font-size: 11px;
font-family: Century Gothic;
padding-left: 20px;
text-align: center;


}

#prawa {
background-image: url(/joomla/templates/tutorial/images/04.gif);
height: 492px;
width: 21px;
float: right;
max-width: 21px;

}

#s1 {
background-image: url(/joomla/templates/tutorial/images/05.gif);
clear: both;
width: 1024px;
height: 42px;
}

a:hover, a:active, a:focus {
color: Red;
text-decoration: underline;
}

a.mainlevel {

font-size: 16px;
font-family: Century Gothic;
vertical-align: super;
color: White;
width: 145px;
height: 30px;
display: block;
line-height: 26px;
margin-bottom: 12px;
text-align: center;
text-decoration: none;
font-weight: bold;
voice-family:"\"}\""; /* Box Model fix */
voice-family:inherit;
background: url(/joomla/templates/tutorial/images/button.gif);
}



html>body a.mainlevel {width:135px;} /* Opera5-Fix-fix ;-) */


a.mainlevel:hover, a.mainlevel#active_menu {
background: url(/joomla/templates/tutorial/images/button1.gif);
width: 150px;
text-decoration: none;
}

a.sublevel {
padding: 0px;
margin: 0px;
font-size: 12px;
padding-left: 12px;
display: block;
line-height: 20px;
margin-bottom: 12px;
text-decoration: none;
font-weight: normal;
voice-family:"\"}\""; /* Box Model fix */
voice-family:inherit;
width: 153px;
height: 15px;
color: white;
}

html>body a.sublevel {width:123px;} /* Opera5-Fix-fix ;-) */

a.sublevel:hover, a.sublevel#active_menu {
text-decoration: none;
width: 139px;
voice-family:"\"}\""; /* Box Model fix */
voice-family:inherit;
width: 123px;
}


html>body a.sublevel:hover, a.sublevel#active_menu { /* Opera5-Fix-fix ;-) */
width: 123px;
}



Z góry dziękuję za wszelką pomoc. :)
Pozdrawiam.

idek
01-02-2008, 11:43
czy problem nadal występuje?

bo u mnie pod FF i IE tekst jest center, natoamist pod IE cała strona jest left, a pod FF center :)

bo0L
01-02-2008, 11:58
tak występuje... zobacz sobie na pierwszego newsa... "tutaj tresc" tekst jest w pargafie <p align="center"></p> a mimo to tekst jest ustawiony przy lewej krawedzi..

inkos
01-02-2008, 14:48
tak występuje... zobacz sobie na pierwszego newsa... "tutaj tresc" tekst jest w pargafie <p align="center"></p> a mimo to tekst jest ustawiony przy lewej krawedzi..
Czy problem występuje nadal? Jeśli tak to jedyny "left" znajduje się w klasie "tresc" pliku css. Przy okazji zauważyłem iż w pliku css brakuje definicji takich klas jak np. "contentpaneopen" które są używane przez Joomla!. Jeśli są wam niepotrzebne to może ich nie być - niemniej jednak Joomla! używa ich do formatowanie niektórych elementów strony więc moga się przydać.

Kerov
16-10-2008, 22:30
czy ktoś rozwiązał ten problem?? Ja mam podobnie... w artukułach tylko, mam 3 różne edytory i w każdym to samo, nie idzie wyśrodkować ;/

/* mambo stuff */


div.mosimage_caption {
font-size: 10px;
color: #666666;
}

div.moduletable {
margin-bottom: 15px;
padding: 0;
}

ul#mainlevel, div.firediv ul{
padding: 0;
margin: 0;
}

ul#mainlevel li, div.firediv li {
background-image: none;
margin: 0;
padding: 0;
}

a.mainlevel:link, a.mainlevel:visited, a.sublevel:link, a.sublevel:visited, div.firediv a {
display: block;
text-align: right;
padding-right: 40px;
height: 20px;
line-height: 20px;
color: #ccc;
background: url(../images/tz_menu_bg.png) top right no-repeat;
}

div.firediv a.sublevel {
background: url(../images/tz_submenu_bg.png) top right no-repeat;
padding-right: 60px;
}

a.mainlevel#active_menu, a.sublevel#active_menu, div.firediv a.active_menu {
color: #fff;
}

a.mainlevel:hover, a.sublevel:hover, div.firediv a:hover {
border: 0px;
color: #fff;
background-position: 100% -20px;
}

span.pathway {
display: block;
height: 14px;
line-height: 15px;
vertical-align: bottom;
padding-top: 7px;
margin-left: 10px;
}

span.pathway img {
vertical-align: top;
}

div.componentheading {
margin: 15px 0px 8px 0px;
}

.contentpane, .contentpaneopen {
margin: 0;
padding: 0;
border-collapse: collapse;
}

.contentheading {
font-family: Arial, Helvetica, sans-serif;
text-align:left;
padding-left: 30px;
padding-top: 20px;
padding-bottom: 0px;
color: #c8b113;
font-size: 20px;
background: url(../images/arrow.png) 0 23px no-repeat;
}

table.contentpaneopen span.small {
padding-left: 30px;
font-size: 90%;
color: #999;
}

td.createdate, td.modifydate {
text-indent: 30px;
font-size: 90%;
color: #999;
padding-bottom: 10px;
}

td.modifydate {
text-indent: 0;
}

input.button {
border: 1px solid #444;
background: #2A2A2A url(../images/tz_button_bg.png) repeat-x;
font-family: Tahoma, Helvetica, sans-serif;
font-size: 11px;
padding: 2px;
color: #ccc;
margin: 10px 0px;
}

input.inputbox {
border: 1px solid #444;
background: #2A2A2A url(../images/tz_input_bg.png) repeat-x;
font-family: Tahoma, Helvetica, sans-serif;
font-size: 11px;
padding: 3px 6px;
color: #ccc;
}

div.pagenavcounter, span.pagenav, th.pagenav_prev a, th.pagenav_next a {
color: #fc0;
font-weight: bold;
margin-bottom: 10px;
}

div.pagenavbar div {
color: #fc0;
font-weight: bold;
margin-bottom: 10px;
}

div.pagenavbar a:link, div.pagenavbar a:visited {
font-weight: bold;
}

div.back_button {
margin: 10px 0;
}

table.contenttoc {
border: 1px solid #444;
padding: 1px;
}

table.contenttoc th {
background: #222;
padding: 2px 5px;
border-bottom: 1px solid #444;
}

table.contenttoc td {
background: #111;
padding: 1px 5px;
}

table.pollstableborder td {
padding: 2px;
}

td.sectiontableheader {
background: #222;
border-right: 1px solid #151515;
padding: 2px;
color: #fff;
}

/* technozine custom stuff */

.clr {
clear: both;
}

div.frame {
height: 100%;
width: 900px;
padding: 0;
margin: 0;
}

div.padding_outside {
padding: 1px;
background: #000;
}

div.padding {
padding: 1px;
}

div.color_seperator {
width: auto !important;
width: 100%;
background: #fc0;
height: 1px;
overflow:hidden;
}

/* horizmenu */
div#horizmenu {
white-space: nowrap;
float: left;
width: 690px;
line-height: 30px;
height: 30px;
}

#horizmenu ul {
float: left;
margin: 0;
padding: 0;
list-style:none;
}

#horizmenu ul.mainlevel li {
float: left;
background: url(../images/tz_horizmenu_sep.png) top right no-repeat;
margin: 0;
padding: 0;
padding-right: 2px;
}

#horizmenu a {
float:left;
display:block;
overflow: hidden;
font-weight: bold;
color: #fc0;
text-transform: uppercase;
text-decoration: none;
font-size: 11px;
letter-spacing: 2px;
height: 21px !important;
height: 30px;
line-height: 10px;
padding: 9px 15px 0px 15px;
text-decoration: none;
}

#horizmenu a:hover {
color: #fff;
border: 0;
background: url(../images/tz_horizmenu_over.png) top left repeat-x;
}

#horizmenu a.active_menu {
background: url(../images/mp_menu_active_bg.png) repeat-x;
color: #fff;
}

#horizmenu a.active_menu:hover {
color: #fff;
}

/* greybox configurations */
div.greybox {
border: 1px solid #444;
width: 100%;
}

div.greybox_bottom {
border-bottom: 1px solid #444;
}

div.greybox_bottom_padding {
border-bottom: 1px solid #444;
padding: 1px;
}

div.greybox_top_padding {
border-top: 1px solid #444;
padding: 1px;
}

/* table column configuration */

td.leftcol {
border-right: 1px solid #444;
padding: 1px;
width: 198px;
padding-bottom: 20px;
}

td.middlecol {
border: 1px solid #000;
background: #151515;
padding-bottom: 20px;
}

td.rightcol {
border-left: 1px solid #444;
padding: 1px;
width: 198px;
padding-bottom: 20px;
}

div.leftdiv {
width: auto !important;
width: 100%;

}

div.firediv {
width: auto !important;
width: 100%;
padding: 1px 10px 35px 10px;
background: url(../images/tz_leftmenu_bg.jpg) bottom left no-repeat;
}

div.leftmodules {
width: auto !important;
width: 100%;
padding: 0px 10px;
margin-top: -20px;
}


div.middlediv {
width: auto !important;
width: 100%;
background: #151515 url(../images/tz_user_bg.png) repeat-x;
padding: 1px 10px;
}

div.rightdiv {
width: auto !important;
width: 100%;
background: #000 url(../images/tz_right_bg.png) bottom left repeat-x;
padding: 1px 10px;
}

div.littlebox {
width: auto !important;
width: 100%;
border: 1px solid #444;
padding: 0 5px 5px 5px;
background: #000;
}

div.littlebox h3 {
margin-top: 5px;
}

div.topnav, div.middlenav {
height: 30px;
background: url(../images/tz_topnav_bg.png) repeat-x;
}

div.horizdivider {
margin: 10px -11px;
height: 3px;
background: url(../images/tz_horiz_divider.png) repeat-x;
}

div.toppath {
float: left;
width: 50%;
color: #ccc;
}

div.topright {
float: right;
width: 40%;
height: 30px;
line-height: 30px;
text-align: right;
color: #999;
margin-right: 10px;
}


div#logobox {
float: left;
border-right: 1px solid #444;
}

div#logopad {
padding-right: 1px;
}

div#logoarea {
width: 200px;
height: 183px;
background: url(../images/tz_logo.jpg) bottom left no-repeat;
}

div#searcharea {
float: left;
width: 200px;
height: 30px;
border-bottom: 1px solid #444;
}

div#searcharea form {
margin: 5px 0;
padding: 0;
vertical-align: bottom;

}

div#searcharea input.inputbox {
margin-left: 15px;
border: 1px solid #444;
background: #2A2A2A url(../images/tz_input_bg.png) repeat-x;
font-family: Tahoma, Helvetica, sans-serif;
font-size: 11px;
padding: 2px;
color: #ccc;
width: 160px;
}

div.main_header {
float: right;
width: 894px;
height: 181px;
background: url(../images/tz_header.jpg) no-repeat;
}

div.datearea {
float: left;
width: 200px;
line-height: 30px;
color: #ccc;
text-align: center;
background: url(../images/tz_horizmenu_sep.png) top right no-repeat;
}

br.small {
display: block;
height: 1px;

}

div#footer {
color: #999;
text-align: center;
height: 30px;
line-height: 30px;
}

td.buttonheading a:hover {
border: 0;

}

/* core html stuff */

html {
height: 100%;
}

body {
height: 0%;
background: #000 url(http://zibix.nazwa.pl/powozownia/templates/jw_technozine/images/tz_body_bg.jpg) right top;
background-repeat: no-repeat;
padding: 0;
margin: 0;

}

td,tr,p,div {
font-family: Tahoma, Helvetica, sans-serif;
line-height: 130%;
font-size: 11px;
color: #ccc;
text-align: left;
}

a:link, a:visited {
color: #fc0;
font-weight: normal;
text-decoration: none;
}

a:hover {
border-bottom: 1px dashed #f90;
}

ul {
float: none !important;
float: left;
margin: 5px 0;
padding: 0;
list-style: none;
}

ul li {

line-height: 15px;
padding-left: 30px;
padding-top: 0px;
background-image: url(../images/arrow.png) ;
background-repeat: no-repeat;
background-position: 0px 1px;
}

form {
padding: 0;
marging: 0;
}

input {

}

h2 {
margin: 15px 0px 8px 0px;
font-size: 12px;
color: #fff;
font-weight: bold;
text-transform: uppercase;
letter-spacing: 2px;
}

h3 {
margin: 15px 0px 8px 0px;
font-size: 12px;
color: #fc0;
font-weight: bold;
text-transform: uppercase;
letter-spacing: 2px;
}

zauważyłem że jak z tego:

td,tr,p,div {
font-family: Tahoma, Helvetica, sans-serif;
line-height: 130%;
font-size: 11px;
color: #ccc;
text-align: left;

usunę
text-align: left;

to działa ale i tak na stronie www.powozownia.com.pl tak wygląda to jak by był bardziej do lewej,
HEL ME

Kerov
22-12-2008, 11:25
ok znalazłem linikjki które psuły mi wyśrodkowanie, mam jeszcze taki problem że stronę wyśrodkowuje ale szerokość nie jest stała co za tym idzie jeśli mam np obraz 300px szeroki to tekst pod nim jest wyśrodkowywany od szerokości 300px, czyli cała tabela jest ustalana według największej szerokości artykułu...
Ktoś wie jak to zmienić?? Mogłbym ustalić stałą szerokość arykułów ale nie wiem gdzie tego szukać bo w index ani w css nie ma, i poza tym nie wiem jak się np zachowają artukuły w archiwum jeśli są obok siebie... Czy idzie zrobić, zmienić tak ja na FRONTPAGE były wszystkie pod sobą??

adamp4
09-03-2009, 12:54
temat w Google znalazłem i się zapytam
__________________________________________________ ________
Mam stronę www.kolbe.wki.pl (http://www.kolbe.wki.pl) i w ie i ff artykuły nie chcą się wyśrodkować tylko jeżeli rozszerzę linijkę jakąś (np wstawię zdjęcie) to do szerokości tej linijki się arty wyśrodkowują.
Może mi ktoś pomoc
Jak co to mogę dać dostęp do PA (również tam jest dostęp do plików)

idek
09-03-2009, 13:27
adamp4 (http://forum.joomla.pl/member.php?u=7385) spróbuj napisać klasę
.blog {
width:100%;
}

adamp4
09-03-2009, 14:13
adamp4 (http://forum.joomla.pl/member.php?u=7385) spróbuj napisać klasę
.blog {
width:100%;
}
To może powiesz w czym to napisać co ??

W poście na stronie głównej dałem kod <hr> który powinien zrobić się na całą szerokość pasek a jest tylko długości napisu strona w budowie.
Właśnie tu teraz widać błąd :(
Strona www.kolbe.wki.pl (http://www.kolbe.wki.pl)

Bazyl
09-03-2009, 15:48
.contentpaneopen {width: 100%;}

Edytujesz plik .css swojego szablonu w np. notatniku.

adamp4
09-03-2009, 17:12
poprawiłem i nic :(

Bazyl
09-03-2009, 19:12
adamp4 (http://forum.joomla.pl/member.php?u=7385) spróbuj napisać klasę
.blog {
width:100%;
}

...daruj mnie błądzącemu.

Oczywiście idek ma rację. Dopisz klasę .blog do swojego szablonu.

idek
10-03-2009, 01:13
luzik bazyl ;) ... a jak Ci adamp4 nie działa, to wina lezy pewnie po twojej stronie, nie żebym ja sie nie mylił, ale widząc Twoje pytanie "gdzie to wstawić" to czasem odechciewa się komukolwiek cokolwiek pisac..

adamp4
10-03-2009, 06:52
no i nie działa
no, może być to wina plików?
dam komuś co by zrobił ,dostęp do PA z programem do pracy na plikach tylko trzeba napisać na WP

floyd
10-03-2009, 07:29
Dopisz do klasy w template_css.css

table.contentpaneopen{
width:100%;
}

adamp4
10-03-2009, 15:22
no i nic nie działa,
nadal dam:


dam komuś co by zrobił ,dostęp do PA z programem do pracy na plikach tylko trzeba napisać na WP

ppilus
10-03-2009, 17:51
#main table.blog {
width:100%
}

adamp4
10-03-2009, 18:50
Jak by się ktoś pytał to strona ma wersję 1.0.15

Nie wiem co się stało ale arty się wyśrodkowały a w spisie np. strona główna aktualności nie
strona www.kolbe.wki.pl (http://www.kolbe.wki.pl)

floyd
11-03-2009, 10:33
A spróbuj jeszcze zmienić w template_css.css

table.contentpaneopen {
width:480px;
}

adamp4
11-03-2009, 16:45
A spróbuj jeszcze zmienić w template_css.css

table.contentpaneopen {
width:480px;
}
Dzięks
Działa, jeszcze raz dzieki
Temat zamykamy