This forum uses cookies
This forum makes use of cookies to store your login information if you are registered, and your last visit if you are not. Cookies are small text documents stored on your computer; the cookies set by this forum can only be used on this website and pose no security risk. Cookies on this forum also track the specific topics you have read and when you last read them. Please confirm whether you accept or reject these cookies being set.

CSS Text position
#1
Hi,

Is there any way to align text menu by css class?
I've created a menu css class and I want to align them horizontally with fixed separation.

It is possible?

Thanks
Reply
#2
Post a screenshot of what you want to achieve. For standard controls any CSS changes will affect all controls of the same type.
Reply
#3
(05.09.2019, 07:31)admin Wrote: Post a screenshot of what you want to achieve. For standard controls any CSS changes will affect all controls of the same type.

Hi,

I have this:

   

And I want to get this by css:

   
Reply
#4
Can you provide a backup?
Reply
#5
(05.09.2019, 09:28)admin Wrote: Can you provide a backup?
.gz   Project-LogicMachine-2019.09.05-11.37 (1).tar.gz (Size: 31.03 KB / Downloads: 13)
Reply
#6
Use this custom CSS. Modify width and height as needed. line-height should be the same as height for text to have middle vertical alignment. Element position should be adjusted in the editor.
Code:
.MenuInicio{
  width: 300px;
  height: 100px;
  text-align: center;
  line-height: 100px;
  text-transform: uppercase;  
}

.item-control.ClasePorDefectoVisible{
  color: white !important;
  border-top: #05a3b7 0.2em solid;
  background-color: #424242;
}
Reply
#7
(05.09.2019, 09:51)admin Wrote: Use this custom CSS. Modify width and height as needed. line-height should be the same as height for text to have middle vertical alignment. Element position should be adjusted in the editor.
Code:
.MenuInicio{
  width: 300px;
  height: 100px;
  text-align: center;
  line-height: 100px;
  text-transform: uppercase; 
}

.item-control.ClasePorDefectoVisible{
  color: white !important;
  border-top: #05a3b7 0.2em solid;
  background-color: #424242;
}


Thank you!

It works
What is ".item-control" for?
Reply
#8
You can just put .ClasePorDefectoVisible there. Multiple selectors are sometimes needed to avoid "!important".
Reply
#9
(05.09.2019, 13:05)admin Wrote: You can just put .ClasePorDefectoVisible there. Multiple selectors are sometimes needed to avoid "!important".
Ok! thanks
Reply
#10
Hi folks,
I am studying the threads because I want to improve visualisation tricks.

Further to thread above, I cannot understant where it is call "MenuInicio". Because when I test the example you show in visualisation page is complete white.

Thanks.
Reply
#11
It's set in Additional classes. If you are testing the attached backup then make sure that you have at least one object on each plan otherwise it won't be shown because empty plans and plan links to such plans are not rendered at all.
Reply
#12
(11.09.2019, 08:20)admin Wrote: It's set in Additional classes. If you are testing the attached backup then make sure that you have at least one object on each plan otherwise it won't be shown because empty plans and plan links to such plans are not rendered at all.

Yes,
you're right. The problem is the missing object. I forget everytime.
Thanks.

(11.09.2019, 08:20)admin Wrote: It's set in Additional classes. If you are testing the attached backup then make sure that you have at least one object on each plan otherwise it won't be shown because empty plans and plan links to such plans are not rendered at all.

Sorry Admin. Where I should declare Additional classes of Menu.Inicio?
Reply
#13
In the same place where ClasePorDefectoVisible, you can add more than one class to an element
Reply
#14
Hi,

Is there any way to do the same with an "icon"? text-align center and line-height don´t work with this type of element.

Thanks
Reply
#15
Why do you need this for icon? Do you have icons with different sizes? If so it would be easier to make icons the same size.
Reply
#16
(23.01.2020, 08:07)admin Wrote: Why do you need this for icon? Do you have icons with different sizes? If so it would be easier to make icons the same size.

Because if I do a table with text and icons text aling in the center but icon stays where I put in visualization.
It would be easyer if I could center the image with text.

Thanks
Reply


Forum Jump: