Responsive Searchbox center align

Hi everybody!

I have just started designing my first website and I am encountering a slight problem with the styling.

I have modified my CSS to place the social icons and the search box in the center of the page, but it only works in screens with my resolution. If I visit my page with a panoramic screen or a larger screen than the one I am using to design it, the items are not in the center.

Is there a way to block their position and for it to be the same on ALL devices?

This is my website: www.recetasparaprincipiantes.com (I am using Wordpress and the Customizr Pro Theme).

How to vertical center div? - I'm trying to make nice vertical dividers

Hi everyone!

I am trying to vertically center divs inside another div, using:

position: relative;
vertical-align: middle;

But it's not working! Does anyone know why?

On this page: http://www.jasonwangart.com/p/about-web.html , I am trying to make the dividers - the vertical black lines - be vertically centered within the parent div.

You can see my code here:

<!doctype html>
 
<style>
 
	.jw-1-about-centre-align
	{		
		width: 300%;

Cannot center an element !!!

Sad(
My markup page contains 2 elements as follows:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>xxx</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
        <style>
         html 
         {
          width: 100%; 
          height: 100%;
         }
         Body 
         {
          height: 100%;
          width: 100%;
         }
         div#bg
         {    
          height:320px; 
          width:850px;
          margin: auto;

Whats the laziest way to replace a center tag that centers a couple of tables, lines of text, images etc.

In HTML5 the 'center' tag is not supposed to be used. But it was a convenient tag, because you could center multiple items, such as a mixture of tables and text and form fields and images, without having to apply css to each one.
I thought of doing something like this, at the beginning of the items
div style="width:100%;text-align:center"
with /div at the end.
but that seems to only work with the text items, at least in some browsers.
Do I really have to apply the "margin=auto" style to all my block type tags?
Thanks,
Gideon

centering the navigation element

HI
I am trying to center the main navigation element on the pages of my premium theme header. Firebug says this is:
<nav role="navigation" class="site-navigation main-navigation">

I tried adding to the theme's custom CSS field:

.nav.site-navigation.main-navigation
{text-align: center;}

also tried:

{
    margin-left:auto;
    margin-right:auto;
    width: 480 px;
}

but nothing helped - the element is either left aligned or right aligned on the page

Any idea what am I doing wrong?

http://blueyecam.com/

Thanks

Syndicate content