小编use*_*774的帖子

使div CSS"display:table-cell"只与div中的文本一样宽

昨天我问了这个问题,以便在我的测试表格中使用省略号.

但是,我现在有另一个我无法解决的问题,这个问题与我提出的答案有关.

当我在小预览中显示用户数据时,省略号生效并显示给用户.这是通过在HTML中使用display:table-cell来完成的.如下所示:

在此输入图像描述

当用户在较大的模态窗口中查看相同的代码时,省略号不再有效,因为有空间显示用户数据.但是,这会使Data di completamento(resumeStyleFinishDateLabel25)太宽,如下所示:

在此输入图像描述

如何更改CSS以使其div Data di completamento 仅与文本一样宽 Data di completamento 并且位于开始日期旁边 - 01/2009div中的文本可以是不同的语言,意思是不同的文本长度,所以我不能使用固定宽度的div.

我已经尝试将CS​​S显示更改tableinline-block,但是这会禁用省略号的效果.我已经完成了一些CSS论坛和SO线程的阅读,但我想不出自己解决这个问题的方法.

我希望有人能告诉我.

这是我的HTML:

<div class="resumeStyleStandardTableRow25">
    <div class="resumeStyleStandardLabels25">Decorrenza</div>
    <div class="resumeStyleStandardLabelContent25">
        <div class="table_ellipsis">
            <div class="resumeStyleDateStartContent25">01/2009</div>
            <div class="resumeStyleFinishDateLabel25">
                <div class="ellipsis">Data di completamento</div>
            </div>
            <div class="resumeStyleDateFinishContent25">
                <div class="ellipsis_finishDate">11/2011 (2 anni, 10 mesi)</div>
            </div>
        </div>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

这是我的CSS:

.resumeStyleStandardTableRow25 {
    display: table-row;
}

.resumeStyleStandardLabels25 {
    direction: ltr;
    display: table-cell;
    font-weight: bold;
    height: 100%;
    min-height: 25px;
    overflow: …
Run Code Online (Sandbox Code Playgroud)

html css

5
推荐指数
1
解决办法
1383
查看次数

ltr和rtl语言之间的popover宽度问题

经过大量的阅读和搜索SO线程后,我几乎让我的popovers工作,因为我希望他们使用不同的语言 - 除了以下问题:

我在ltr语言(英语,法语,德语等)和rtl语言(阿拉伯语,希伯来语等)之间的bootstrap 3 popovers的宽度有所不同.

在我的ltr langauges中,popover的宽度只有它所需的宽度 - 最大宽度为600px;,如下所示:

在此输入图像描述

在我的rtl语言中,弹出窗口的宽度是600px的最大宽度,而不是宽度只是它需要的宽度,如下所示:

在此输入图像描述

我不确定为什么会这样.我已经阅读了很多很多SO帖子,并广泛搜索谷歌,但我无法解决这个问题.

任何人都可以指出为什么我的ltr和rtl语言弹出窗口之间的宽度有差异?我想要使​​rtl popover只在它需要的范围内.这可能是一个简单的修复,但我只是看不到问题.

以上两个屏幕截图显示了相同的信息(来自数据库),只是使用不同的CSS文件,具体取决于rtl/ltr语言.

这是我的ltr css代码:

.popover {
    direction: ltr;
    position: fixed;
    word-break: normal;
    word-wrap: break-word;
    z-index: 9999;
    background-color: lavender;
}

.popover.right {
    background-color: blueviolet;
    margin-left: 17px;
    max-width: 600px;
}

.popover.left {
    background-color: gold;
    margin-right: 0px;
    min-width: 375px;
}
Run Code Online (Sandbox Code Playgroud)

这是rtl css代码:

.popover {
    direction: rtl;
    position: fixed;
    word-break: normal;
    word-wrap: break-word;
    z-index: 9999;
    background-color: khaki;
}

.popover.right {
    background-color: indianred;
    margin-left: 17px;
    min-width: 375px; …
Run Code Online (Sandbox Code Playgroud)

html css twitter-bootstrap bootstrap-popover

5
推荐指数
1
解决办法
510
查看次数

使用JQuery或JavaScript覆盖Chrome浏览器拼写检查语言

我使用的是最新的Chrome浏览器版本55.0.2883.87 m.

在HTML网页上的输入元素上,如何使用JQuery/JavaScript动态覆盖Chrome浏览器拼写检查程序的语言?

例如,如果页面以英语(美国)显示并且拼写检查器设置为英语(美国),我如何传递de的德语语言代码,以便表单内所有输入元素的文本区域将使用德语而不是英语(美国)语言拼写检查输入?

这是一个示例HTML文本区域.

<textarea cols="40" id="id_objective_details" maxlength="1000" name="objective_details" rows="10" class="kmw-disabled keymanweb-font textArea01"></textarea>
Run Code Online (Sandbox Code Playgroud)

html javascript jquery google-chrome spell-checking

5
推荐指数
1
解决办法
835
查看次数

饼图.js-显示所有3个分段边界

我有一个饼图chart.js的边框设置为1。

显示图表时,每个细分市场不会显示其3个边框。

在此处输入图片说明

我认为该边框存在,但是下一段应用于左边框的顶部-隐藏了显示的左边框。

是否存在将显示每个饼图段的所有3个边框的设置?

这是我的代码

new Chart(document.getElementById('example-pie-chart-1'), {
  type: 'pie',
  data: {
    labels: [
      '{% blocktrans %}Views{% endblocktrans %}',
      '{% blocktrans %}Print Requests{% endblocktrans %}',
      '{% blocktrans %}PDF Downloads{% endblocktrans %}',
      '{% blocktrans %}DOCX Downloads{% endblocktrans %}',
    ],
    datasets: [{
      backgroundColor: [
        'rgba(71, 101, 160, 0.3)', // #4765a0.
        'rgba(0, 0, 0, 0.3)', // #000000.
        'rgba(52, 137, 219, 0.3)', // #3489db.
        'rgba(179, 179, 179, 0.3)', // #b3b3b3.
      ],
      hoverBackgroundColor: [
        'rgba(71, 101, 160, 0.6)', // #4765a0.
        'rgba(0, 0, 0, …
Run Code Online (Sandbox Code Playgroud)

html javascript chart.js

5
推荐指数
1
解决办法
297
查看次数

django for .html模板页面中的循环(新手)

在学习一门新语言/框架时,我真的很讨厌的是,当我遇到一个看似容易解决的问题时,我感到多么无知.

我在html页面中有一个django for循环但由于某种原因它无法正常工作.我错过了一些东西并无法自行解决问题,所以我转向StackOverflow来帮助我.

这是我的模型我在models.py上运行我的查询:

class RIAchievement(models.Model):
  riAchievementID = models.AutoField(primary_key=True, db_column="RIAchievementID")
  userLanguageVersionID = models.ForeignKey(UserLanguageVersion, db_column="UserLanguageVersionID")
  typeAchievementID = models.ForeignKey(TypeAchievement, db_column="TypeAchievementID")
  riAchievementTypeUserDescription = models.CharField(max_length=255, blank=True, null=True, db_column="RIAchievementTypeUserDescription")
  riAchievementDescription = models.TextField(max_length=2000, db_column="RIAchievementDescription")
  auth_user_id = models.ForeignKey(auth_user, db_column="auth_user_id")
  class Meta:
    db_table="RIAchievement"
Run Code Online (Sandbox Code Playgroud)

这是我的models.py文件位于我的项目中的地方:GlobalXpy\app_data\models.py

这是我的views.py文件中的代码:

from django.shortcuts import render_to_response
from GlobalXpy.app_data.models import RIAchievement

def index(request):
  ri_achievement = RIAchievement.objects.all()
  get_template = loader.get_template('ri_achievement.html')
  return render_to_response(get_template)
Run Code Online (Sandbox Code Playgroud)

这是我的模板文件(ri_achievement.html)中的for循环:

{% for e in ri_achievement %}
  <td> Preview  Edit  Duplicate  Delete </td>
  <td> FlagPath </td>
  <td> …
Run Code Online (Sandbox Code Playgroud)

django for-loop

4
推荐指数
1
解决办法
2万
查看次数

parsley.js表单验证 - 确认表单提交时没有发现错误

我已经阅读了parsley.js文档,但我仍然在学习JQuery,因此它只需一只耳朵即可.

我想我需要添加一个自定义事件监听器来实现我的需要,但我真的不确定,所以一些帮助将不胜感激.

我有一个嵌入了parsley.js的表单.表单按预期工作,但我必须向表单添加一些功能.

当所有客户端错误被清除或者在提交表单时没有客户端错误时,我如何向用户显示警报消息(警告('无客户端错误!');)?

这是我的表单代码的示例:

<form id="name_details_form" class="form-horizontal" method="post" data-parsley-validate>

    <div id="row_id_name_details_first_name" class="control-group">
        <label for="id_name_details_first_name" class="control-label required">First Names:</label>
        <div class="controls">
            <input data-parsley-required="true" data-parsley-maxlength="200" data-parsley-required-message="This field is required." maxlength="200" type="text" id="id_name_details_first_name" name="name_details_first_name" class="input-xxlarge parsley-error" data-parsley-id="8581" dir="ltr"><span class="parsley-errors-list filled" id="parsley-id-8581" style="display: none;"><span class="parsley-required">This field is required.</span></span>  
        </div>
    </div>

    <div id="row_id_name_details_middle_name" class="control-group">
        <label for="id_name_details_middle_name" class="control-label ">Middle Names:</label>
        <div class="controls">
            <input id="id_name_details_middle_name" type="text" name="name_details_middle_name" data-parsley-maxlength="200" maxlength="200" class="input-xlarge" data-parsley-id="7500"><span class="parsley-errors-list" id="parsley-id-7500" style="display: none;"></span> 
        </div>
    </div>

    <div id="row_id_name_details_last_name" class="control-group  ">
        <label for="id_name_details_last_name" class="control-label required">Last Names:</label>
        <div …
Run Code Online (Sandbox Code Playgroud)

javascript django jquery parsley.js

4
推荐指数
1
解决办法
5729
查看次数

你确定/脏的形式 - 隐藏或显示请等待

我在测试表单上使用脏表单/你确定js,确认用户是否确实想要离开未保存更改的页面.

这按预期工作,但我也使用"请等待"图像,显示用户何时调用服务器.

如何只触发"请稍候"的形象,只有当用户点击"离开此页"按钮上的ARE-你,肯定消息弹出框?

目前,当用户点击取消按钮时,我已触发请等待图像,b/c我无法想到还有什么地方可以触发它.

这是我的<head>代码:

<div id="loading-div-background">
    <div id="loading-div" >
        <img  src="{{ STATIC_URL }}img/page-loader.gif" />
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

这是我的模板代码:

<a href="{% url certification_details %}" class="btn" onclick="showProgressAnimation();">Cancel</a>
Run Code Online (Sandbox Code Playgroud)

这是我的js代码:

<script>
    $('form').areYouSure( {'message':'You have unsaved changes.'} );
</script>
Run Code Online (Sandbox Code Playgroud)

编辑 - 根据要求添加了隐藏图像css.

这是第一次加载页面时隐藏了请等待图标的CSS:

#loading-div-background {
    background-color: rgba(246,246,246,0.7);
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
}
Run Code Online (Sandbox Code Playgroud)

javascript forms jquery form-submit

4
推荐指数
1
解决办法
1391
查看次数

垂直对齐中间div与浮动左右

我有一个并排显示的用户名和照片,如下图所示.

在此输入图像描述

我现在正在尝试更改css,以便照片动态浮动到左侧,用户名动态浮动到右侧.

我尝试添加float:right并向左浮动到css但这只会使照片显示在用户名下.

我已经阅读了几个类似的线程并尝试了很多东西,但我无法解决这个问题.真的很令人沮丧.这可能是一个简单的修复,但我看不到它.

使用CSS,如何在右侧显示用户名,在左侧显示照片,并且仍然具有用户名和照片vertical-align:middle,宽度为100%?用户上传的照片可以是不同的高度,所以我不能使用行高.

这是我的HTML代码:

<div class="resumeStyleResumeTitleWrapper17">
    <div class="resumeStyleResumeTitle17">
        <div class="resumeStyleResumeTitleInner17">
            <div class="resumeStyleResumeTitleFontChange17">User Name</div>
        </div>
        <div class="resumeStyleResumeTitlePhotograph17">
            <div class="resumeStyleResumeTitlePhotographInner17">
                {# image has max-height: 149px & max-width: 149px; assigned in the css file #}
                <img class="name_details_photograph_preview_dimensions" src="{{ image_url }}" />
            </div>
        </div>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

这是我的css代码:

.resumeStyleResumeTitleWrapper17 {
    display: table-cell;
    width: 100%;
}

.resumeStyleResumeTitle17 {
    background-color: #000;
    color: #fff;
    direction: ltr;
    display: table-cell;
    float: left;
    text-align: left;
    width: 100%;
}

.resumeStyleResumeTitleInner17 {
    background-color: #000;
    color: #fff;
    direction: ltr;
    display: table-cell;
    max-height: …
Run Code Online (Sandbox Code Playgroud)

html css css-float

4
推荐指数
1
解决办法
3151
查看次数

bootstrap工具提示 - 使用jquery动态更改css和放置

我正在使用Bootstrap v3.3.5和JQuery v1.11.3.

我有一个选择列表,当选择一个值时,我希望工具提示的placement和css类更改.

我搜索了谷歌和SO并阅读了很多SO帖子,但我做过的许多尝试都失败了.例如,对我不起作用.

这是我的HTML代码:

<select id="id_cover_letter_type" name="cover_letter_type">
    <option value="0" selected="selected">I will write my own data</option>
    <option value="1">Standard Cover Letter</option>
    ....
</select>

<i id="id_icon_id_cover_letter_details_second_paragraph" class="fa fa-lightbulb-o blue_color icon_size26 verticalAlignTop" data-original-title="" title="" aria-describedby="tooltip229278"></i>
Run Code Online (Sandbox Code Playgroud)

这是我的jquery代码:

我已经包含了我为改变工具提示(取自其他帖子)的数据位置所做的已注释尝试,这些尝试对我不起作用.

$("#id_icon_id_cover_letter_details_second_paragraph").tooltip({'html': true, 'placement': 'bottom', 'title': '{% trans "Paragraph 2" %} <br /><br /> {% trans "This should detail why you want the job." %} <br /><br /> {% trans "Explain how your qualifications and career plan match the advertised position." %} <br /><br …
Run Code Online (Sandbox Code Playgroud)

html javascript jquery twitter-bootstrap

4
推荐指数
1
解决办法
1632
查看次数

django-taggit - 在 django-admin 添加记录页面上显示现有标签

我使用 django/python 和django-taggit创建了一个测试 vlog 应用程序。

视频博客和标签正常工作。

但是,我想在 django-admin 界面中为新的和更新的 vlog 条目列出所有现有标签 - 类似于在 django-admin 列表页面上将标签显示为过滤器。

这将使为每个新的或更新的 vlog 条目选择新标签或现有标签变得更加容易。

这是我help-text在标签输入字段上添加标签的意思:

我的models.py 代码:

class VlogDetails(models.Model):
    ....
    vlog_video_image_url = models.URLField(null=False, blank=False, max_length=250, unique=True, help_text='http://img.youtube.com/vi/You_Tube_URL/0.jpg')
    ....
    tags = TaggableManager(help_text='List all the available tags here.')
Run Code Online (Sandbox Code Playgroud)

下面是 django-admin 输入表单界面:

在此处输入图片说明

是否可以在新的/编辑 django-admin 页面上以另一种方式显示现有标签?

我已经在 django-admin 列表页面上列出了现有/现有标签作为过滤器,如下所示。此过滤器显示不会显示在新的/更新的输入表单上。

django-admin 过滤器代码:

class VlogDetailsAdmin(BaseDetailsAdmin):
....
    list_filter = [
        'vlog_date_published',
        'tags',
        'vlog_timestamp_added',
        'vlog_timestamp_updated'
    ]
Run Code Online (Sandbox Code Playgroud)

![在此处输入图片说明

我已经尝试了几件事,但都没有奏效,而且我在文档中找不到任何相关的想法。任何建议将不胜感激。谢谢。

python django django-models django-taggit

4
推荐指数
1
解决办法
1532
查看次数