Беда с таблицами, как уменьшить шрифт?
-
Помогите сузить таблицу, задаю ширину 600, уменьшаю текст в таблице (заголовок 6), а он зараза так и выходит за рамки
http://sro-mfo.ru/reestr-organizatsiy/tsentralnyiy-fo/
-
у вас каждая колонка тоже свою ширину имеет, в сумме большую 600
Хм, вроде не назначал ни на один столбец ширину. Я сейчас пытаюсь выделить столбец => Ячейки => Свойства ячейки таблицы и назначаю ширину для выделенных ячеек, чет не меняется ничего.
В коде размер не меняется, но менять в самом коде это не комильфо
Ладно… я в коде поменял, таблица неизменна
В коде 170, по факту 223, WTF товарищи?
У вас:
<td style="text-align: center;" width="34">
а надо:<td style="text-align: center; width: 34px;">
И так далее.
О привет) а исправить это можно только в коде или есть вариант полегче?)
Почему то когда вставляешь таблицу в эту страницу, автоматом задается ширина ячейки. на др страницах нет такого.
Добрый день. Я в своих таблицах вообще не указываю ширину колонок. А вот в файле стилей указаны гарнитура шрифта, размер шрифта и величины отступов в ячейках. Что-нибудь вроде:
table { font-family: "Arial", sans-serif; font-size: 10px; color: #000; ... } ... table th, table td { padding: 3px 5px; }
Да я бы тоже рад не указывать ширину, но вот автоматом все делает на этой странице. В style.css
много похожего. Если я тут что то поменяю не повлияет ли на остальной сайт?@font-face { font-family: "Gothic"; src: url("fonts/GOTHIC.TTF"); font-style:normal; font-weight: normal;} @font-face { font-family: "GothicB"; src: url("fonts/GOTHICB.TTF"); font-style:normal; font-weight: bold;} /* @font-face { font-family: "GothicBI"; src: url("fonts/GOTHICBI.ttf"); font-style:italic; font-weight: bold;} @font-face { font-family: "GothicI"; src: url("fonts/GOTHICI.ttf"); font-style:italic; font-weight: normal;} */ /*@font-face { font-family: "OpenSans-Regular"; src: url("fonts/OpenSans-Regular.ttf");font-style:normal; font-weight: normal; } @font-face { font-family: "OpenSans-Bold"; src: url("fonts/OpenSans-Bold.ttf"); font-style:normal; font-weight: bold;} @font-face { font-family: "OpenSans-Italic"; src: url("fonts/OpenSans-Italic.ttf"); font-style:italic; font-weight: normal;} */ * { color: #000; } body { font-family: 'Open Sans', sans-serif; font-size: 14px; background: url('images/pattern.jpg'), repeat; color: #000; } h1, h2, h3, h4, h5 { margin-top: 0px; margin-bottom: 20px; } section { color: #000; } a { color: #1976d2; } a:hover { color: #2196f3; } .container { width: 960px !important; background-color: #fff; border-left: 1px solid #cfcfcf; border-right: 1px solid #cfcfcf; position: relative; } .admin-bar .container:first-child { position: relative; top:-32px; border-top: 1px solid #cfcfcf; } .article { color:#3399ff; font-family: 'GothicB'; line-height: 56px; vertical-align: middle; } .margin-fix{ margin: 0px; } .clear { clear:both; } .content-wrapper { min-height: 300px; } /*bs fix*/ .navbar-default .navbar-text { color:#000; } .navbar-default { background-color: #ffffff; border-color: #ffffff; } .navbar-default .navbar-nav>li>a { color: #000; } .navbar-nav.navbar-right:last-child { margin:0; } /* ***Header*** */ #wpadminbar { background: transparent !important; } #wp-admin-bar-top-secondary { background: #777 !important; } #wp-admin-bar-homepage-link, #wp-admin-bar-forum-link { display: none !important; } .admin-bar #menu.fixed { top: 32px; } #menu.fixed { z-index: 9999; top: 0; position: fixed; } .head-top{ height: 93px;} /*top wrap*/ .navbar-default{ background: #fff; border:0; } .navbar-brand { display: block; padding:6px 13px; margin-bottom: 20px; } .navbar-header{ display: inline-block; float: left; } .slogan { display: inline-block; float: left; width: 270px; font-size:14px; margin-right: 30px; line-height: 20px; } .rev-open { font-size: 13px; font-weight: bold; display: inline-block; color: #fff; text-decoration: none; background: #00bcd4; padding: 7px; width: 144px; text-align: center; line-height: 1.4; position: relative; top: 23px; } .rev-open:hover, .rev-open:active { color: #fff; text-decoration: none; background: #00dcf8; } .recall { display: inline-block; float: left; font-family: 'GothicB'; font-size:18px; font-weight: bold; } .recall a { font-family: 'Gothic'; font-weight: normal; color: #1976d2; border-bottom: 1px dashed #1976d2; text-decoration: none; font-size:16px; } .navbar-right { display: inline-block; float: left; } .nav-icons{ display: inline-block; float: left; text-align: center; width:73px; height: 93px; padding-top: 10px; } .nav-icons:hover{background: #1976d2;} .nav-icons a { font-size: 10px; color:#000; } .navbar-default .navbar-nav>li.nav-icons>a:hover { color:#fff;} .navbar-default .navbar-nav>li:hover .invert { -webkit-filter: invert(100%); filter: invert(100%); } #search { display: none; margin: 6px 0px 12px; } #search .btn-info { background: #1976d2; } /* menu bar .main-menu { width: 958px; } .main-menu ul{ border: 0; border-top: 1px solid #CFCFCF; border-bottom: 1px solid #CFCFCF; background: #f2f2f2; } .main-menu ul li{ text-align: center; vertical-align: middle; border-right: 1px solid #CFCFCF; height: 60px; } .main-menu ul li a{ font-family: 'Gothic'; font-size: 16px; padding: 0px 15px; color:#000; height:60px; display: table-cell; vertical-align: middle; text-align: left; } .main-menu ul li.active { background: #1976d2; } .main-menu ul li.active a, .main-menu ul li.active a nobr{ color: #fff; } .main-menu>ul> li:hover { background: #1976d2; cursor: pointer; } .main-menu> ul> li:hover a, .main-menu> ul> li:hover > a > nobr { background: #1976d2; color:#fff; } .main-menu ul li.mlast {border-right: 0;} nav.navbar{ height:93px; }*/ /* * NEW Menu bar */ .link3d.nav > li > a { padding: 0; } .link3d.nav { border: 0; border-top: 1px solid #CFCFCF; border-bottom: 1px solid #CFCFCF; width: 958px; position: relative; z-index: 1; } .link3d li { border-right: 1px solid #CFCFCF; vertical-align: middle; } .link3d li:last-of-type, .link3d li.last { border-right: 0; } .link3d li a { font-family: 'Gothic'; font-size: 13px; white-space:nowrap; height:60px; line-height: 60px; -webkit-perspective: 1000px; -moz-perspective: 1000px; perspective: 1000px; } #menu-item-488 a span { white-space:normal; line-height: 30px; } /* Для 2х строк в Меню */ .link3d li a span { position: relative; display: inline-block; /* padding: 0 8px; */ padding: 0 3px; width: 100%; background: #F2F2F2; /* first */ color: #000; -webkit-transition: -webkit-transform 0.3s; -moz-transition: -moz-transform 0.3s; transition: transform 0.3s; -webkit-transform-origin: 50% 0; -moz-transform-origin: 50% 0; transform-origin: 50% 0; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; } .link3d li a span::before { position: absolute; top: 100%; left: 0; width: 100%; height: 100%; background: #0965a0; color: #fff; content: attr(data-hover); -webkit-transition: background 0.3s; -moz-transition: background 0.3s; transition: background 0.3s; -webkit-transform: rotateX(-90deg); -moz-transform: rotateX(-90deg); transform: rotateX(-90deg); -webkit-transform-origin: 50% 0; -moz-transform-origin: 50% 0; transform-origin: 50% 0; } .link3d li a:hover span, .link3d li a:focus span { -webkit-transform: rotateX(90deg) translateY(-22px); -moz-transform: rotateX(90deg) translateY(-22px); transform: rotateX(90deg) translateY(-22px); } .link3d li a:hover span::before, .link3d li a:focus span::before { background: #197ad6; } #menu-levoe-menyu-v-razdele-quot-registratsiya-na-forum-quot { margin-bottom: 20px; } #menu-levoe-menyu-v-razdele-quot-registratsiya-na-forum-quot li { margin-bottom: 7px; } /* carousel */ .caption-wrap { background: transparent !important; opacity: 1 !important; } .metaslider .caption { padding: 0 !important; } .carousel-mycontent { width: 300px; } .carousel-caption { position: absolute; left: 40px !important; top: -345px !important; } /* old carousel */ .carousel-control { width: 20px; opacity: 1; background: transparent; } a.carousel-control{ color: #000; } a.carousel-control:hover{ color: #fff; } .carousel-caption p { text-align:left; border-top: 2px solid #fff; border-bottom: 2px solid #fff; padding: 20px 0; } /*.carousel-caption { left: 30px !important; top:20px !important; */ } .carousel-mycontent { border-top:2px solid #fff; border-bottom:2px solid #fff; width:290px; color: #fff; } .carousel-mytitle { display: block; font-family: 'GothicB'; font-size:30px; line-height: 26px; color: #fff; } .carousel-mycaption { min-height: 130px; display: block; padding: 10px 0; color: #fff; font-size: 16px; } .btn-slide { font-family: 'GothicB'; font-size:16px; width:195px; height: 54px; } .main-heading h1 { margin-top:20px; } /* bluerow */ .bluerow { background: url(images/front-page/bg-blue.jpg); min-height: 387px; } .blue-title { text-align: center; } .blue-title h4{ color: #2196f3; text-shadow: 2px 2px 2px #fff, -2px -2px 2px #fff, 2px -2px 2px #fff, -2px 2px 2px #fff; } .bluerow li { background: #ccc; } .bg { background: #ccc; } .nobrd{ margin-bottom: 0px; padding: 0px 15px; } .nobrd >tbody>tr> td { vertical-align: middle; width: 450px; border-top:0; text-align: left; line-height: 16px; } .nobrd >tbody>tr> td> img { float: left; margin:0px 15px; } .jointo, .rg { font-family: 'GothicB'; font-size: 16px; font-weight: bold; width: 190px; height:55px; color:#fff; background: none; border:2px solid #1976d2; border-radius: 0; } .jointo:hover, .rg:hover { background: linear-gradient(to bottom, #2194f1, #197ad6); color:#fff; } .row-centered { text-align:center; } .col-centered { display:inline-block; float:none; text-align:center; /* height: 180px; */ margin-right:-4px; } .col-centered p { padding: 11px 0; color:#000; } .col-centered:hover p{ color: #2196f3; text-decoration: underline; } .news-block { background-color: #faf8f8; border: 1px solid #dbdbdb; } .news-top-wrapper { position: relative; z-index: 2; top:5px; left:-11px; background: url('images/front-page/crn1.png') no-repeat; height: 45px; padding-left: 11px; } .news-title{ width:180px; height:33px; background-color: #00bcd4; padding: 8px 15px; font-family: 'Century Gothic'; color: #fff; } .ntw2 { background: url('images/front-page/crn2.png') no-repeat; } .ntw2 .news-title { background-color: #2196f3; } .ntw3 { background: url('images/front-page/crn3.png') no-repeat; } .ntw3 .news-title { background-color: #1976d2; } .news-body { padding: 2px 15px; margin-bottom: 15px; } .news-date { font-family: 'century Gothic', sans-serif; color: #727272; } .nthumb { color: #1976d2; line-height:18px; } .nthumb img{ padding:0px 15px 5px 0px; } .ncaption { line-height: 16px; margin-bottom: 35px; } .ncaption a{ display: block; text-align: right; } .articles { font-size:12px; } .footer { background: #212121; min-height:130px; padding: 15px; margin-top: 15px; } .footer > ul { display: inline-block; float: left; width: 20% !important; list-style: none; } .footer > ul > li > a { color: #fff; font-weight: normal; } .footer > ul { padding:0; } .footer > ul > li:first-child > a { font-family: 'Open Sans', sans-serif; font-weight: bold; color: #1976d2; line-height: 24px; } .footer > ul > li { padding: 0 10px; margin-bottom: 6px; } /* Sidebar */ ul.sidebar { position: relative; z-index: 2; list-style: none; padding: 0px; } .sidebar > li { margin-bottom: 4px; } ul.sidebar >li.page_item a { font-family: 'Open Sans', sans-serif; font-size: 14px; color: #000; text-decoration: underline; } .current_page_item > a { font-family: "GothicB" !important; font-weight: bold; } #breadcrumbs { padding: 16px 10px 10px 10px; } #breadcrumbs a { color: #1976d2; text-decoration: underline; } .breadcrumb_last { color: #1976d2; font-weight: bold; } /* Map */ .map { padding: 0px; } .map div { width: 570px; height: 313px; margin: 15px auto 45px; background: url("http://sro-mfo.ru/img/branches_map.gif") 0 0 no-repeat; } #branches_map { width: 570px; height: 313px; border: 0; background: url("http://sro-mfo.ru/wp-content/themes/unity/images/branches_map.gif") 0 0 no-repeat; /* background: url("http://sro-mfo.ru/img/branches_map.gif") 0 0 no-repeat; */ } .marker{ position: absolute; color: #55CBEC; font-size: 24px; } .marker:hover{ transform: scale(1.2); cursor: pointer; color: red; } .m1 { top:310px; left:43px; } .m2 { top:274px; left:52px; } .m3 { top:252px; left:77px; } .m4 { top:265px; left:93px; } .m5 { top:239px; left:136px; } .m6 { top:290px; left:155px; } .m7 { top:227px; left:344px; } .row-centered > .col-centered > a > img { opacity: 0.7; } .row-centered > .col-centered > a > img:hover { opacity: 1; } #back-top { position: fixed; right: 20px; bottom: 20px; border: 2px solid #438ed9; border-radius: 22px; background: transparent; color: #438ed9; width: 36px; height: 36px; text-align: center; opacity: 0.8; z-index: 100; } #back-top span{ color: #438ed9; } #back-top:hover { cursor: pointer; opacity: 1; } .glycenter { color:#000; top: 6px; } .facebook img { margin-top: 12px; } .emodal { padding: 0; margin: 0; } .white-popup-block{ background: #FFF; text-align: left; max-width: 570px; margin: 40px auto; position: relative; -webkit-box-shadow: 7px 7px 10px 0px #000; -moz-box-shadow: 7px 7px 10px 0px #000; box-shadow: 7px 7px 10px 0px #000; } .contact-heading{ background: url(images/modal-top-bg.png) repeat-x #1a7bd9; width: 100%; height: 95px; padding: 8px 12px; margin: 0; } .contact-heading img { display: inline-block; float: left; } .contact-heading p.title { font-size: 18px; font-family: "GothicB"; display: inline-block; width: 440px; padding: 15px 30px; float:left; color: #fff; } .white-popup-block fieldset { padding: 20px 12px; } .carousel-control.left { background: none; !important } .carousel-control.right { background: none; !important } /* for О партнерстве (parent: page-9) */ .down-main-menu { /* menu row */ background: #f9f8f8; padding: 18px; } .menu-inline { padding: 0; margin: 0; text-align: center; } .menu-inline>li { color: #1976d2; /* mark color */ padding-left: 8px; margin: 0px 15px !important; float:left; } .menu-inline>li .children { position: absolute; list-style: none; padding: 20px 0px; text-align: left; line-height: 30px; } .menu-inline>li:first-child { list-style: none; } .menu-inline li a { font-size: 14px; text-decoration: underline; color: #000; } .menu-inline > .current_page_item { font-family: "GothicB"; } /* for press-center page */ .cat-pres { list-style: none; } .cat-pres li { margin-right: 30px; float: left; } .tab { border: 1px; font-size: 11px; width: 100%; } .tab th { background: #0088cc; color: #fff; text-align: center; border: 1px solid #dddddd; } .tab td { border-left: 1px solid #dddddd; font-size: 11px; line-height: 12px; padding: 8px; text-align: left; vertical-align: top; } .tab tr { border: 1px solid #dddddd; } .p1 { display: block; position: relative; float: left; } .p1 img { height:505px; width: 690px; float:left; margin: 10px; } .sidebar .inc{ width: 210px; margin-top: 20px; } /*for content */ .content-btns .col-6 { margin-bottom: 15px; } .content-btns a { text-decoration: none; } .prez-img { width: 688px; margin-bottom: 15px; } a.frontpage-news { color:#fff; text-decoration: none; } a.frontpage-news:hover { color: #fff; text-decoration: underline; } .forum-request-wrap { width: 302px; } .forum-request-wrap h4 { color: #fff; font-size: 16px; font-weight: 700; font-style: italic; line-height: 36px; background-color: #08c; background-image: linear-gradient(to top, #a3d1f8 0%, #035a86 100%); } .forum-request-wrap h4 span { color: #035a86; /* font-family: OpenSans; */ font-size: 22px; font-weight: 700; width: 26px; height: 26px; display: inline-block; text-align: center; background: #fff; vertical-align: middle; border-radius: 26px; /* padding-bottom: 8px; */ top: -2px; position: relative; margin-left: 4px; margin-right: 12px; line-height: 24px; } .forum-request-wrap .wpcf7-list-item { display: block; } .forum-request-wrap .wpcf7-submit { background-color: #035a86; border: 2px solid #035a86; width: 100%; color: white; /* font-family: OpenSans; */ font-size: 18px; font-weight: 700; } .text-box { float: left; display: block; position: relative; margin-left: -12px; margin-right: 12px; } .aligncenter { margin: 10px auto; display: block; } img.alignleft { text-align: left; float: left; margin-right: 10px; clear: left; } .vk-a { position: absolute; top: 10px; right: -27px; transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; } .fb-a { position: absolute; top: 50px; right: -27px; transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; } .sh-top { position: absolute; top: 90px; right: -27px; transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; } .fb-a:hover, .vk-a:hover, .sh-top:hover { right: -35px; } .bgw { position: absolute; top: 85px; right: 0; width: 50px; height: 50px; background: #fff; } .map { padding: 0px; } .map div { width: 570px; height: 313px; margin: 15px auto 45px; background: url("images/branches_map.gif") 0 0 no-repeat; } #branches_map { width: 570px; height: 313px; border: 0; background: url("images/branches_map.gif") 0 0 no-repeat; } img.b1, img.b2, img.b3 { position: absolute; top: 53px; left: 54px; width: 205px; height: 350px; } img.b3 { animation: hidone 19.9s infinite linear; /*-o-animation: todaybut .3s linear; -moz-animation: todaybut .3s linear; -webkit-animation: todaybut .3s linear;*/ } @keyframes hidone { 0% {height: 350px;} 30.125% {height: 350px;} 30.126% {height: 0px;} 100% {height: 0px;} } img.b2 { animation: hidtwo 19.9s infinite linear; /*-o-animation: todaybut .3s linear; -moz-animation: todaybut .3s linear; -webkit-animation: todaybut .3s linear;*/ } @keyframes hidtwo { 0% {height: 0px;} 30.125% {height: 0px;} 30.126% {height: 350px;} 80.845% {height: 350px;} 80.846% {height: 0px;} 100% {height: 0px;} } .hgt730 { height: 775px; overflow: hidden; } .page-numbers { font-size: 16px; } .rev-offer { color: #000; } .rev-offer h3 { font-size: 30px; } .rev-offer input[type=text], .rev-offer input[type=tel], .rev-offer input[type=email] { width: 100%; padding-top: 4px; padding-bottom: 4px; } .rev-offer textarea { width: 100%; height: 150px; resize: none; } .rev-offer input[type=submit] { font-size: 16px; font-weight: bold; display: inline-block; color: #fff; text-decoration: none; background: #00bcd4; padding: 12px; width: 200px; text-align: center; line-height: 1.4; position: relative; top: 23px; border: 0; } span.share { display: inline-block; margin-left: 10px; } .mr20 { margin-top: 20px; } .no-underline { text-decoration: none !important; } .banner-nas-mnogo { margin-top: 20px; position: relative; display: table; width: 100%; background: url('images/bg.jpg') no-repeat; height: 99px; } .banner-nas-mnogo .cell { display: table-cell; vertical-align: middle; text-align: center; font-size: 50px; color: #FFFFFF; text-shadow: -0 -3px 0 #034688, 0 -3px 0 #034688, -0 3px 0 #034688, 0 3px 0 #034688, -3px -0 0 #034688, 3px -0 0 #034688, -3px 0 0 #034688, 3px 0 0 #034688, -1px -3px 0 #034688, 1px -3px 0 #034688, -1px 3px 0 #034688, 1px 3px 0 #034688, -3px -1px 0 #034688, 3px -1px 0 #034688, -3px 1px 0 #034688, 3px 1px 0 #034688, -2px -3px 0 #034688, 2px -3px 0 #034688, -2px 3px 0 #034688, 2px 3px 0 #034688, -3px -2px 0 #034688, 3px -2px 0 #034688, -3px 2px 0 #034688, 3px 2px 0 #034688, -3px -3px 0 #034688, 3px -3px 0 #034688, -3px 3px 0 #034688, 3px 3px 0 #034688, -3px -3px 0 #034688, 3px -3px 0 #034688, -3px 3px 0 #034688, 3px 3px 0 #034688; } @keyframes wink { 0% {background: red;} 50% {background: #00bcd4;} 100% {background: red;} } .banner-nas-mnogo .button { position: absolute; display: inline-block; top: 50%; height: 66px; margin-top: -33px; right: 16px; width: 244px; text-align: center; background: red; border-radius: 0; font-size: 24px; line-height: 66px; color: #fff; animation: wink 6s infinite ease; -o-animation: wink 6s infinite ease; -moz-animation: wink 6s infinite ease; -webkit-animation: wink 6s infinite ease; } .mfc_popup { display: block; height: 107px; width: 160px } //#menu-item-1244 span {text-decoration: underline;}
Да я бы тоже рад не указывать ширину, но вот автоматом все делает на этой странице. В style.css
много похожего, но только примерно (нет такого что бы начиналось такtable {
). Если я там что то поменяю не повлияет ли на остальной сайт?В колонке «Наименование» Ниже у вас идут тексты с тегом
<h6>...</h6>
. Извините, но нафига? Во-вторых, похоже в строчках, начина с номера 292 В этих текстах есть непереносимые пробелы. Что-то вроде
Между словами. Из-за этого подобные конструкции помещаются в одну строчку и ячейка таблицы однозначно разъезжается до длины таких строк. Кроме того, на сайте использована сетка bootstrap, а в ней, конечно, имеются свои стили. Что бы вы не городили в качестве размера шрифта, для тега h6 в бутстрапе определён размерfont-size: 12px;
.Либо, убрать теги h6 в таблицах и потом уже задать свои размеры шрифта для таблиц, что предпочтительнее. Либо, переопределить размер шрифта для h6.
Между нами, я предпочёл бы переверстать всю таблицу с нуля, чем убирать все эти заголовки шестого уровня и тому подобное.
<h6>...</h6>
Для меня пока единственный способ уменьшить размер шрифта, знаю что это не есть хорошо весь текст заголовком выделять.
К сожалению в текстовом редакторе не увидел 
через ctrl+F искал.Тогда вопрос как задать размер шрифта на таблице? И как убрать ширину столбцов?
Т.е. не вставлять с ворда? Я готов все равно надо сделать хорошо))
- Тема «Беда с таблицами, как уменьшить шрифт?» закрыта для новых ответов.