2018-10-22         Julius

Xpages radio group label placement

Seems so simple, but I can't crack it. All I want, is the label of each value in a radio button group to display above each radio button..... Tried a few things with CSS but no cigar as of yet, so any pointers would be appreciated.I pass values using composite data objects in my custom control<xc:ccQuestionInterimRadios required="true" dataSource="#{document1}" fieldName="test" helpText="Please select an answer" placeholder="Enter any further details here..." questionHeader="primary" questionTextNJD="QuestionTextNJD" questionText="Question text goes here"&...

 css                     2 answers                     43 view
 2018-10-22         Booth

how to find pixel position of image from sprite image

I want to know how to find an image position(coordinates) while using sprite image for styling. Another, easier way to do this is through this site called Sprite Cow. I just tried it recently, and it makes things go by much faster. [XXX]You can use a tool like this and get background positions of the icons in the sprite.You need to first upload your image, then select an icon from the sprite. CSS will be generated, just copy the generated CSS and use it in your class.Other options are You need to open the image in an image editor like Photoshop. From there you can fin...

 css                     5 answers                     50 view
 2018-10-22         Sally

CSS image sprites

Is the only benefit of using css image sprites that there is less http requests?Or is there other benefits?Also is there an easy way of detiming which area of a sprite to show? Like you said, one of the main advantage is to reduce the number of requests to the server, improving the response time (especially if you're loading a large amount of small images). But this is not the only reasons people use sprites.If you don't use sprites for a "mouse over" display, the user will see the image disappear for a second... and it looks really bad. This is because if you change the...

 css                     5 answers                     56 view
 2018-10-22         Richard

CSS Styling Forms -- IE 6/7 bug

I am developing a website using forms and one of the browsers being targeted is unfortunately IE 6 and 7. I am having an issue with CSS and IE's rendering of form elements that are styled.I have written a test case, and it is as such (also available online at http://xistence.osnn.net/testcases/ie67fieldset/):<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><head> <title>IE [6|7] Wha?</title> <style type="text/css"> html, body,...

 css                     1 answers                     28 view
 2018-10-22         Lynn

KafkaOffsetMonitor UI css not loading

I am running a kafka cluster and I want to monitor the various details of kafka. For that, I am using KafkaOffsetMonitor. I have downloaded the already packaged jar and when I am running it, the css for the tool is not loading. Everything is working fine except the css. Can you help me with this? I want to use this tool for a presentation.https://github.com/quantifind/KafkaOffsetMonitor/releases/tag/v0.2.1 This is the link from where I downloaded the jar andjava -cp KafkaOffsetMonitor-assembly-0.2.1.jar \ com.quantifind.kafka.offsetapp.OffsetGetterWeb \ --zk zk-serv...

 css                     1 answers                     59 view
 2018-10-22         Ethel

Light background color is not showing on PC

I am working with WordPress and When I giving the light background colorAny content then background color is not showing, But When I am using the laptop then background color is showing.I am using the Ubuntu 16.04 and monitor is AOC I did R&D but problem is same.May be this is monitor issue, I am not sure. Check with inspect element in PC is that code applies to this div.It's possible that you have poor monitor and that light color not significantly different from white color ;)I had this issue on old monitor. [XXX]

 css                     1 answers                     29 view
 2018-10-22         Francis

How to avoid Background Image overlapping the Blocks

I have inserted an image in the background in my drupal 7 portal. And the css for it is ...code :* { box-sizing: border-box; text-align: center; background-image: url('https://xx.xxx.xx.xxx/devuser/sites/all/BackgroundWallpapersforPortal/blue image.jpg') !important; background-color:none; }However, with this my image looks like this -I don't want my background image to overlap the blocks. I have visited few websites, their background image doesn't overlap every new statement / every new entity. it stays embed to background. Please help.I want to Achieve this - whe...

 css                     1 answers                     64 view
 2018-10-22         Regina

Class "notranslate" for google translate plugin change the css of the website

So if I copy and paste the google translate plugin code snippet:<div id="google_translate_element"></div><script type="text/javascript"> function googleTranslateElementInit() { new google.translate.TranslateElement({pageLanguage: 'en', layout: google.translate.TranslateElement.InlineLayout.SIMPLE}, 'google_translate_element'); }</script><script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>It changes all my site css [from headings, animations to even boostrap...

 css                     2 answers                     95 view
 2018-10-22         Theodore

How can I have different style for different slots?

In my app I have styles.css. Right now I'm setting up slots for the team where we have dev, test and production slots. How can I have a different styles.css for dev, and another one for test? What I want to do is to simply have dev and test with another color in the top navigation indicating that this is not production (your in the wrong place - keep out coloring).I've looked at application settings, but I don't know how I can enforce settings in .css files. Maybe the answer is a virtual directory, "overwriting" path to styles.css to a styles-dev.css in the dev slot?Does vi...

 css                     1 answers                     29 view
 2018-10-22         Osborn

Use ngFor items to display another item before the first element

I would like to display an array using ngFor but before the first element I want to display a card (the user can click inside to show a modal)Here the code :<div fxFlex="25" *ngFor="let product of products; let i = index"> <div *ngIf="i == 0"> <mat-card (click)="addProduct()" class="mat-card-add-button"> <div fxLayout="row" fxLayoutAlign="center center" fxFlex="100%"> <span style="font-size:32px;text-align:center">+<br />Add product</span> </div> ...

 css                     1 answers                     83 view
 2018-10-22         Barret

Rotating clockwise 180 then 360

I have a cog icon that I want to spin clockwise 180deg when activated (class="cards__cog cards__cog-active") and then spin another 180deg clockwise to return to its deactivated state (class="cards__cog cards__cog-inactive"). I am doing this with React, reacting to a change in the state when the cog is clicked.The below works but my problems are:1) It animates on page load (which makes sense because it has the cards__cog-inactive class but what is the alternative?).2) It is ugly and there must be an easier way.Thank you.cards { &__cog { position: absolute; ...

 css                     5 answers                     17 view
 2018-10-22         Renata

Overflow auto on flex div cuts the image from top

I have implemented the image viewer, where I can rotate the image and can be able to do zoom-in and zoom-out.Zoom-in and zoom-out work well and rotate as well.But when I rotate the image and the zoom it, the image gets cut from the top.I have tried adding an absolute position to image and giving it top:0, but neither that worked.Can anyone help?.modal-container { position: fixed; top: 0; left: 0; bottom: 0; right: 0; background: rgba(0, 0, 0, 0.5); overflow-x: auto;}.modal-container .modal-window { display: -ms-flexbox; display: flex; flex-dire...

 css                     1 answers                     91 view
 2018-10-22         Benedict

CSS Buttons rounded on one side

I have to create a button like that :I thought it would be easy to do that, but I have some trouble to do the rounded side (left, right), and I guess I will have problem to add the little extra color too.I have made something like that for now (I feel like colors are not the same).home_header_buttons { display: flex;}.home_header_buttons .btn_home { position: relative; text-transform: uppercase; font-family: 'Poppins', sans-serif; font-weight: 500; font-size: 20px; letter-spacing: 2.4px; margin-right: -2.4px; line-height: 13px; background-color: rgba(8, 17, 23, .5...

 css                     3 answers                     90 view
 2018-10-22         Greg

Fill Colour on <use> Element For a <symbol> Isn't Changing Colour

I'm trying to change the fill colour on an SVG symbol when it is inside a <use> element. Because there are going to be multiple instances of the symbol on the page, I can't do this is the <symbol> element, because the different instances of <use> will be different colours.I've can't seem to get it work though. In the example below I would like to the bottom instance to be a blue twitter icon.In the CSS I've done #bottom-twitter svg path {fill:blue;} which doesn't work. And I can't seem to get anything to work.Any help would be amazing.#box1 { height: 5re...

 css                     1 answers                     91 view
 2018-10-22         Amy

Merge Flaticon collections / use multiple collections at the same time

We are using Flaticons on our website (their Iconfont format). However I would like to add a few more icons into the pack. I tried creating another collection on Flaticon and then manually merge them but it would not work for me. Especially since I am just able to merge .css and .svg files manually.The file structure looks like this:However using 2 Flaticon packs at the same time seems to interfere with each other. I believe it's because of the unicode identifiers. What is the way to use 2 Flaticon packs next to each other or merge them into one? Currently Flaticon does ...

 css                     1 answers                     9 view
 2018-10-22         Joyce

Angular Data URLs processing

I use the flag-icon-css library and for some flags the size is not correct due to the background-image property which is interpreted differently. I did not manage to create a Stackblitz so here is the minimal step to reproduce:ng new bug-socd bug-sonpm install flag-icon-cssIn angular.json, I added the CSS: "styles": [ "src/styles.css", "node_modules/flag-icon-css/css/flag-icon.min.css" ],In app.component.html<div style="padding: 5em"> <span class="flag-icon flag-icon-es" style="border: 1px solid black"></span><br/> &...

 css                     1 answers                     10 view

Page 1 of 940  |  Show More Pages:  Top Prev Next Last