Hello,
I seriously need urgent assistance on centering list & search type form elements (Title, inputbox, and buttons) as seen here attached.
When I created this, everything aligned to the left. How can i align the elements to the center? As seen below is how I wanted the elements aligned;-
I have tried all I could include playing with the template positioning and CSS, but no success.
Kindly assist in guiding me to center those three elements and also to support mobile responsiveness.
.
Hope to hear from you soon.
Thanks in advance for your time.
Hello yusuf.
Do you have this example online? To answer this we need to know your html code.
But maybe you can do this adding a wrapper to those buttons and style with certain width and margin:auto.
try this :
div.cck_forms.cck_search div.cck_form {width: 87%;}
Hi Yusuf i take a look and follow this steps:
1 - Access through ftp/cpanel and edit this archive - sep1/media/cck/css/cck.search.css.
2 - You will need to remove the float:left style inside this css selector: div.cck_forms.cck_search div.cck_form or near the line 84. After do this, your buttons will be center align.
3 - Inside your css archive, create this above rule:
#art_title_backend {
width: 98%;
}
This will change the width of your search input, keeping all the elements align.
Hi,
Thanks Rafael!
Note: topic not related to SEBLOD itself but about CSS.
Thanks @all for your contributions, it is now fixed.
Thanks for your time.
Hi,
Thanks for the previous help.
Am back with another little requests! Still on the same issue but responsively (on mobile) this time.
My form doesn’t align properly to center on mobile device? Your help will be appreciated.
I don’t want to create a new post for this as is more of CSS not seblod itself as noted by @Bes above.
Finally, I did like to have a text/icon appendfed at the end of the input box as seen below?
Thanks in advance.