problem z przesunięciem tekstu

[wampir666]

jak mogę przesunąć sam tekst w tabeli względem lewej strony ?

Gdy w css mam tak:

td {
text-align: left;
font-size: 11px;
padding-left: 4px;


}

to mi się całość psuje, a gdy margin to nie reaguje na to :(
A bez tego tekst jest zupełnie przy krawędzi tabeli a powinien być odsunięty :(

[idek]

głowy nie dam, bo jest późno i nie chce mi sie sprawdzać, ale próbuj to zapisac tak:


table td {
text-align: left;
font-size: 11px;
padding-left: 4px;
}

[wampir666]

Niestety także psuje się tym sposobem:

http://images30.fotosik.pl/300/ffff31d1ad861b41.jpg

I także nie wiem jak zrobić aby każdy moduł był od siebie odsunięty w osobnej tabeli ? bo teraz jak widać są przy sobie a bym chciał by była przerwa i nie wiem jak to osiągnąć...

[moje]

Podaj link do strony.

[wampir666]

niestety ale mam na krasnalu.
Wrzucić gdzieś cały styl czy podać tylko index.php i css ?

[moje]

Chodzi o to, że ramka wyświetla się dla całej pozycji, a nie dla modułu, więc powinieneś zmienić ten kod w css'ie- o ile wiesz jak.

[wampir666]

właśnie nie bardzo wiem jak,

css wygląda tak:


/* CSS Document */

html {
height: 100%;
}

body {
margin: 0px;
font-family: Arial, Helvetica, Sans Serif;
line-height: 120%;
font-size: 11px;
color:#FFFFFF;
background-image:url(../images/tlo.jpg);
background-attachment: fixed;
background-position:center;

}

.clr {
clear: both;
}

.outline {
border: 1px solid #cccccc;
background: #ffffff;
padding: 2px;
}

ul#mainlevel-nav
{
list-style: none;
padding: 0;
margin: 0;
font-size: 0.8em;
}

ul#mainlevel-nav li
{
background-image: none;
padding-left: 0px;
padding-right: 0px;
float: left;
margin: 0;
font-size: 11px;
line-height: 26px;
white-space: nowrap;
background-image:url(../images/spacer.png);
background-repeat:no-repeat;
background-position:right;

}

ul#mainlevel-nav li a
{
display: block;
padding-left: 15px;
padding-right: 15px;
text-decoration: none;
color:#666666;
background: transparent;

}

table.content_table {
width: 100%;
padding: 0px;
margin: 0px;

}

table.content_table td {
padding: 0px;
margin: 0px;


}



.user1_inner {
border: 1px solid #cccccc;
float: none !important;
float: left;
margin: 0px;
padding: 2px;

}

.user2_inner {
border: 1px solid #cccccc;
float: none !important;
float: left;
margin: 0px;
padding: 2px;
}

table td.body_outer {
padding: 2px;
border: 1px solid #cccccc;


}

.maintitle {
color: #ffffff;
font-size: 40px;
padding-left: 15px;
padding-top: 20px;

}

.error {
font-style: italic;
padding: 5px;
color: #cccccc;
font-size: 14px;
font-weight: bold;
}

/** old stuff **/

.back_button {
float: left;
text-align: center;
font-size: 11px;
font-weight: bold;
border: 3px double #cccccc;
width: auto;
background: url(../images/button_bg.png) repeat-x;
padding: 0px 10px;
line-height: 20px;
margin: 1px;
}

.pagenav {
text-align: center;
font-size: 11px;
font-weight: bold;
border: 3px double #cccccc;
width: auto;
background: url(../images/button_bg.png) repeat-x;
padding: 0px 10px;
line-height: 20px;
margin: 1px;
}

.pagenavbar {
margin-right: 10px;
float: right;
}

#footer {
text-align: center;
padding: 3px;
}

ul
{
margin: 0;
padding: 0;
list-style: none;
}

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


td {
text-align: left;
font-size: 11px;




}

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

a:hover {
color:#F8F8F8;
text-decoration: none;
font-weight: bold;
}

table.contentpaneopen {
width: 100%;
padding: 0px;
border-collapse: collapse;
border-spacing: 0px;
margin: 0px;
}

table.contentpaneopen td {
padding-right: 5px;
}

table.contentpaneopen td.componentheading {
padding-left: 4px;

}



table.contentpane {
width: 100%;
padding: 0px;
border-collapse: collapse;
border-spacing: 0px;
margin: 0px;
}

table.contentpane td {
margin: 0px;
padding: 0px;
}

table.contentpane td.componentheading {
padding-left: 4px;
}

table.contentpaneopen fieldset {
border: 0px;
border-bottom: 1px solid #eee;
}

.button {
color: #666666;
font-family: Arial, Hevlvetica, sans-serif;
text-align: center;
font-size: 11px;
font-weight: bold;
border: 1px solid #cccccc;
width: auto;
line-height: 18px !important;
line-height: 16px;
height: 26px !important;
height: 24px;
}

.inputbox {
padding: 2px;
border:solid 1px #cccccc;
background-color: #ffffff;
}

.componentheading {
background: url(../images/subhead_bg.png) repeat-x;
color: #FFFFFF;
text-align: left;
padding-top: 4px;
padding-left: 4px;
height: 21px;
font-weight: bold;
font-size: 12px;}

.contentcolumn {
padding-right: 5px;
}

.contentheading {
height: 30px;

color:#F0F0F0;
font-weight: bold;
font-size: 14px;
white-space: nowrap;
}



.contentpagetitle {
font-size: 13px;
font-weight: bold;
color: #cccccc;
text-align:left;
}

table.searchinto {
width: 100%;
}

table.searchintro td {
font-weight: bold;
}

table.moduletable {
width: 100%;
margin-bottom: 5px;
padding: 0px;
border-spacing: 0px;
border-collapse: collapse;
}

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

table.moduletable th, div.moduletable h3 {
background: url(../images/subhead_bg.png) repeat-x;
color: #FFFFFF;
text-align: left;
padding-left: 4px;
height: 21px;
line-height: 21px;
font-weight: bold;
font-size: 12px;
margin: 0 0 2px 0;
}

table.moduletable td {
font-size: 11px;
padding: 0px;
margin: 0px;
font-weight: normal;

}

table.pollstableborder td {
padding: 2px;
}

.sectiontableheader {
font-weight: bold;
background:#333333;
padding: 4px;
}

.sectiontablefooter {

}

.sectiontableentry1 {
background-color:#555555;
height:20px;
}

.sectiontableentry2 {
background-color:#666666;
height:20px;
}

.small {
color:#CCCCCC;
font-size: 11px;
}

.createdate {
height: 15px;
padding-bottom: 10px;
color: #CCCCCC;
font-size: 11px;
}

.modifydate {
height: 15px;
padding-top: 10px;
color: #CCCCCC;
font-size: 11px;
}

table.contenttoc {
border: 1px solid #cccccc;
padding: 2px;
margin-left: 2px;
margin-bottom: 2px;
}

table.contenttoc td {
padding: 2px;
}

table.contenttoc th {
background: url(../images/subhead_bg.png) repeat-x;
color: #666666;
text-align: left;
padding-top: 2px;
padding-left: 4px;
height: 21px;
font-weight: bold;
font-size: 12px;}

a.mainlevel:link, a.mainlevel:visited {
display: block;
background: url(../images/menu_bg.png) no-repeat;
background-position:top left;
font-size: 11px;
font-weight: bold;
color:#666666;
text-align: left;
padding-top: 5px;
padding-left: 18px;
height: 21px !important;
height: 26px;
width: 100%;
text-decoration: none;
}

a.mainlevel:hover {
background-position:bottom left;
text-decoration: none;
color:#990000;
}

a.mainlevel#active_menu {
background-position:bottom left;
text-decoration: none;
color:#990000;
}

a.mainlevel#active_menu:hover {
color: #666666;
}

a.sublevel:link, a.sublevel:visited {
padding-left: 1px;
vertical-align: middle;
font-size: 11px;
font-weight: bold;
color: #666666;
text-align: left;
}

a.sublevel:hover {
color: #333333;
text-decoration: none;
}

a.sublevel#active_menu {
color: #333;
}

.highlight {
background-color: Yellow;
color: Blue;
padding: 0;
}
.code {
background-color: #ddd;
border: 1px solid #bbb;
}

form {
/* removes space below form elements */
margin: 0;
padding: 0;
}

div.mosimage {
border: 1px solid #ccc;
}

.mosimage {
border: 1px solid #cccccc;
margin: 5px
}

.mosimage_caption {
margin-top: 2px;
background: #efefef;
padding: 1px 2px;
color: #666;
font-size: 12px;
border-top: 1px solid #cccccc;
}

span.article_seperator {
display: block;
height: 1.5em;
}

[wampir666]

a index.php tak
(Zmieniłem dodając moduł w dodatkową tabelę aby tylko ten moduł miał inny kolor a nie cała lewa czy prawa strona, inaczej całość miało)


<?php
defined( '_VALID_MOS' ) or die( 'Restricted access' );
// needed to seperate the ISO number from the language file constant _ISO
$iso = explode( '=', _ISO );
// xml prolog
echo '<?xml version="1.0" encoding="'. $iso[1] .'"?' .'>';
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<?php mosShowHead(); ?>
<?php
if ( $my->id ) {
initEditor();
}
$collspan_offset = ( mosCountModules( 'right' ) + mosCountModules( 'user2' ) ) ? 2 : 1;
//script to determine which div setup for layout to use based on module configuration
$user1 = 0;
$user2 = 0;
$colspan = 0;
$right = 0;
// banner combos

//user1 combos
if ( mosCountModules( 'user1' ) + mosCountModules( 'user2' ) == 2) {
$user1 = 2;
$user2 = 2;
$colspan = 3;
} elseif ( mosCountModules( 'user1' ) == 1 ) {
$user1 = 1;
$colspan = 1;
} elseif ( mosCountModules( 'user2' ) == 1 ) {
$user2 = 1;
$colspan = 1;
}

//right based combos
if ( mosCountModules( 'right' ) and ( empty( $_REQUEST['task'] ) || $_REQUEST['task'] != 'edit' ) ) {
$right = 1;
}
?>
<meta http-equiv="Content-Type" content="text/html; <?php echo _ISO; ?>" />
<link href="<?php echo $mosConfig_live_site;?>/templates/mitra_dark/css/template_css.css" rel="stylesheet" type="text/css" />
</head>
<body>

<div align="center">
<table border="0" cellpadding="0" cellspacing="0" width="900">
<tr>
<td width="9" style="background-color: black"></td>
<td width="885">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td colspan="3">
<img border="0" src="<?php echo $mosConfig_live_site;?>/templates/mitra_dark/images/logo.jpg" style="border-bottom: 0px solid #32373D; border-top: 0px solid #545C66"></td>
</tr>
<tr>
<td style="border-top: 0px solid #545C66; background-color:black; border-bottom: 0px solid #32373D" colspan="0"></td>
</tr>
<tr>
<td style="background-color:black; border-bottom: 0px solid #32373D" colspan="0" valign="top">
<table border="0" cellpadding="3" width="100%" cellspacing="3">
<tr>
<td><div align="center"><?php mosLoadModules ( 'top', -1); ?></div></td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td style="height: 550px; border-bottom: 5px solid black; border-top: 5px solid black; border-right: 5px solid black; border-left: 5px solid black; background-color:black" valign="top" width="180">
<table width="100%%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td style="border-bottom: 1px solid white; border-top: 1px solid white; border-right: 1px solid white; border-left: 1px solid white; background-color:#262626" valign="top"><?php mosLoadModules ( 'left', -2); ?></td>
</tr>
</table>
</td>
<td style="background-color:black" valign="top">
<table border="0" cellpadding="2" width="100%">
<tr>
<td><?php mosPathway(); ?></td>
</tr>
<tr>
<td style="background-color:#262626" valign="top"><?php mosMainBody(); ?></td>
</tr>
</table>
</td>
<?php
if ( $right > 0 ) {
?>
<td style="height: 550px; border-bottom: 5px solid black; border-top: 5px solid black; border-right: 5px solid black; border-left: 5px solid black; background-color:#262626" valign="top" width="180">
<?php mosLoadModules ( 'right', -2); ?></td>
<?php
}
?>

</tr>
</table>
</td>
</tr>
<tr>
<td style="height: 50px; background-image: url('<?php echo $mosConfig_live_site;?>/templates/mitra_dark/images/bac_user.png'); border-bottom: 1px solid #32373D; border-top: 1px solid #545C66; text-align:center" colspan="3">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td style="text-align: center">Design:
<a target="_blank" href="http://www.joomlamarket.de">
Joomlamarket.de</a></td>
</tr>
<tr>
<td style="text-align: center"> <?php include_once( $GLOBALS['mosConfig_absolute_path'] . '/includes/footer.php' ); ?>
<?php mosLoadModules( 'debug', -1 );?>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td width="6" style="background-color: black"></td>
</tr>
</table>
</div>

</body>
</html>

[zwiastun]

@wampir666: zainstaluj sobie wtyczkę firebug do FF i pobadaj.

[wampir666]

właśnie jest ten problem, że każda tabela się przesunie jak i tamto.
Czy idzie jakoś stworzyć klasę tabeli ? I może wtedy byłoby ok ?

Bo tym badaniem to nie wiem co tam zmienie... td i body za to odpowiada... ale wtedy zniszczy resztę, chociaż nie rozumiem bo jak margin to powinien się sam margines a nie tło i obrazki...

[zwiastun]

Czego nie rozumiesz? Margines dla tabeli? Przesunie tabelę, razem z tłem i obrazkami. Niby dlaczego miałoby być inaczej?
Klasę tabeli tworzysz jak każdą inną klasę

[wampir666]

no że nie można zrobić by sam tekst był przesunięty. To jakim sposobem tak jest zrobione np tutaj ? i wszędzie jest tak odsunięte, nie wiem już jak to zrobić.. chyba będę musiał inny styl wybrać do zmiany, bo nie wiem jak zrobić też by były oddzielone od siebie przerwą.. a nie złączone...

[zwiastun]

odległość zawartości komórek od krawędzi ustalana jest własnością padding

[wampir666]

ale właśnie wtedy jest to co na obrazku :/
a z kolei cellpadding też przesuwa całość

jak zrobić by ten obrazek (nagłówek) nie został przesunięty ? tylko by sam tekst

Zastanawia mnie dlaczego nie reguje to na:

table.moduletable td {
font-size: 11px;
padding: 0px;
margin: 0px;
font-weight: normal;

}


Próbowałem padding zmienić jednak nie zmieniło się, zmieniłem wielkość czcionki także nie zmieniło się wcale :O


Dobra sprawa wygląda tak, za tą tabelę odpowiada to:


div.moduletable {
background: red;
color: #FFFFFF;
text-align: left;
padding-left: 4px;
font-size: 11px;
margin: 0 0 20px 0;
border: 2px solid white;
}

a za ten nagłówek (niebieskie odpowiada to):


table.moduletable th, div.moduletable h3 {
background: url(../images/subhead_bg.png) repeat-x;
color: #FFFFFF;
text-align: left;
padding-left: 4px;
height: 21px;
line-height: 21px;
font-weight: bold;
font-size: 12px;
margin: 0 0 2px 0;
}

Problem wygląda tak, że ten nagłówek też się przesuwa, a ma być rozciągnięty na całość, da się to wymusić by nagłówek się nie ruszał ? Bo jest już podzielone wszystko git, tylko jest w nagłówko przerwa o te 4 piksele, a chce by ten pasek niebieski był rozciągnięty po całej szerokości...