css

问题 I am trying to align a text to be centered with the page (as you can see here https://imgur.com/oxokwqx the "Carol Housing" text is a bit to the left . The problem is that my text has a javascript animation added to it and even if try to center it with FlexBox or text-align dosen't seem to do much Here is the code HTML CODE /*Animatie titlu linii frumoase*/ anime.timeline({loop: false}) .add({ targets: '.ml5 .line', opacity: [0.5,1], scaleX: [0, 1], easing: "easeInOutExpo", duration: 1000 })

问题 I am using a package called Buefy which is a Vue.js wrapper for the Bulma CSS framework library. Buefy puts an attribute/property on its template components called type ( e.g. , type="is-warning" ). As per the Buefy documentation, the term "is-warning" is pre-defined according to the $colors variable set within SCSS: So I followed these instructions from Buefy to be able to customize the the $colors map, but what I would like to do, however, is keep the initial SCSS defined in those

问题 I've built a network graph with Highcharts and I'm struggling to find a way to easily "expand" or "show" a node's children. The problem I've got is that the way the data is declared is very linear. It doesn't really have much of a hierarchy. Here's a pen of what I have so far https://codepen.io/anon/pen/xvGMwa. The issue I have is that the "links" aren't associated with the nodes. So I can't easily find a group of nodes and their links and hide/show them. What I'd like is for it to start off

问题 I'm trying to create a pyramid. I figured I'd use the CSS clip-path for that. I meant to do a triangle (which I managed to do) and several trapezoids beneath it (even the first one failed). .container { min-width: 50%; max-width: 50%; } .triangle { background-color: yellow; clip-path: polygon(90% 100%, 50% 0%, 10% 100%); } .trapeze { background-color: blue; clip-path: polygon(0% 10%, 0% 90%, 0% 100%, 100% 100%); } div { min-height: 200px; max-height: 200px; border-color: black; border-style:

问题 In my reactJS application, I use a list of Material UI ToolTip with IconButton as children inside a div container with overflow: scroll . In a particualar row the Material UI ToolTip looks like this: <ClickAwayListener onClickAway={handleTooltipClose}> <Tooltip PopperProps={{ disablePortal: true, }} onClose={handleTooltipClose} open={open} disableFocusListener disableHoverListener disableTouchListener title={data} arrow > <InfoOutlinedIcon className={classes.root} onClick={handleTooltipOpen}

问题 I have tried many different methods mentioned here and elsewhere on the web, but none of them do what I want it to achieve. I currently have elements on a webpage positioned and styled with the code below. Then below that, I have a footer div that I want to be at the bottom of the page content (see attached images). If the content height is less than the screen height, I can either have the footer at the bottom of the screen or directly under the content (both work). If the content is larger

问题 I'm trying to add a linear gradient to a material UI icon using the background-clip property but it just doesn't show up? .social-icon{ background: linear-gradient(to right bottom, #FD297B, #FF5864, #FF655B); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } ''' <div className="social-icons"> <FacebookIcon className="social-icon" fontSize="large" /> <TwitterIcon className="social-icon" fontSize="large" /> <InstagramIcon className="social-icon" fontSize="large" />

问题 I'd like to display a thumbnail in a popover when I hover over text (a camera emoji) in our Django Admin view. The code I have works, but displays the image inline, which disrupts the rest of the layout of the site I'm by no means a Django expert, so there might be something easy I'm missing. I'm totally open to using other libraries to help if that's the best path forward, but am not sure of how to appropriately load them in to django admin. I'm also open to pure js/css solutions - whatever

问题 Is there a way to support 2x, 3x and 4x images in SVG pattern? * { margin: 0; padding: 0; } #Avatar { opacity: 1; fill: url(#Avatar_A0); } .Avatar { position: absolute; overflow: visible; width: 38px; height: 38px; left: 10px; top: 10px; } <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <meta http-equiv="X-UA-Compatible" content="IE=edge"/> <title>Support HiDPI Images</title> </head> <svg class="Avatar"> <pattern id="Avatar_A0" x="0" y="0" width="100%" height="100%"> <image x="0" y="0"

问题 W3 is very ambiguous about this. I've read everything about Inline-boxes, Line-boxes, anonymous boxes, block-boxes and all kinds of boxes, but nowhere is explicitly stated whether line boxes are formed inside inline-level elements. W3 states that "line box is the rectangular area that contains the (inline)boxes that form a line". Then it says that "Line boxes are created as needed to hold inline-level content within an inline formatting context" So far, it seems that inline elements do