Giriş Yap / Kayıt Ol
ytmatikvip

WM Aracı'na üyelikler tekrar açıldı! Kayıt olmak için TIKLAYIN!


Cevap Yaz Favorilerime Ekle
Seçenekler Stil
Geri Git   Forum > > HTML - CSS - XML

Wordpress Ek Css Tablo Yardımı

  #1  
Okunmamış 22 Mayıs 2020, 16:51
ercorc Adlı Üyenin Avatarı
Grafik Tasarımcı
 
Üyelik Tarihi: 21 Mayıs 2018
Yaş / Cinsiyet: 33 / Erkek
Ad, Soyad: Er... Or...
Mesajlar: 187
Beğeniler: 42 / 95
Ticaret: 1, 100%
Arkadaşlar bu formu(1. Resim) https://gebeliko.com/gebelik-hesaplama nasıl aşağıdaki resim(2. Resim) haline getirebilirim. EK CSS düzeltebilecek bir arkadaş yardım edebilir mi?

Mevcut hali


yapmak istediğim



Kod:
.fieldset{
	display:flex;
	justify-content:center;
	padding-bottom:1em;
}

.fieldset input[type=button],
.fieldset input[type=reset]{
	width:auto;
	background:#ad134b;
	color:#fff;
	border:none;
	border-radius:3px;
	padding:6px 14px;
	font-size:16px;
	cursor:pointer;
}
.fieldset input[type=reset]{
	margin-left:10px;
	background:#fff;
	border:2px solid #ad134b;
	color:#ad134b;
}

.field {
  position: relative;
	width:100%;
	margin-bottom:1em;
}
.fieldset .field+.field{
	margin-left:1em;
}
.field label::before {
  content: attr(title);
  position: absolute;
  top: -8px;
  left: 10px;
  line-height: 12px;;
  font-size: 14px;
  color: #777;
  transition: 300ms all;
	background:#fff;
	padding:0 6px;
	
}
.field input, .field select {
  width: 100%;
	border-radius:3px;
	border:1px solid #ccc;
	font-size:14px;
	line-height:1;
}
https://gebeliko.com - Gebelik Sitesi
  #2  
Okunmamış 22 Mayıs 2020, 22:56
ercorc Adlı Üyenin Avatarı
Grafik Tasarımcı
 
Üyelik Tarihi: 21 Mayıs 2018
Yaş / Cinsiyet: 33 / Erkek
Ad, Soyad: Er... Or...
Mesajlar: 187
Beğeniler: 42 / 95
Ticaret: 1, 100%
Güncel, yardım lütfen.
https://gebeliko.com - Gebelik Sitesi
  #3  
Okunmamış 22 Mayıs 2020, 23:35
mimarcan Adlı Üyenin Avatarı
Mimar
 
Üyelik Tarihi: 11 Ocak 2013
Yaş / Cinsiyet: 35 / Erkek
Meslek: Mimar
Ad, Soyad: İd... Ya...
Mesajlar: 593
Beğeniler: 137 / 1115
Ticaret: 0, 50%
Anladığım kadarıyla bir tek dışındaki çerçeve kalmış?
ercorc bunu beğendi.
  #4  
Okunmamış 22 Mayıs 2020, 23:36
Avatar Seçilmemiş
rws rws şuan çevrimiçidir.
WM Aracı
 
Üyelik Tarihi: 23 Ekim 2012
Yaş / Cinsiyet: 33 / Erkek
Meslek: kimyager
Ad, Soyad: Er... Bu...
Mesajlar: 671
Beğeniler: 134 / 92
Ticaret: 2, 100%
bu şekilde yapamazsınız, önce formu class="field" li bir div içine alıp sonra

<label for="duedate" title="GEBELİK HESAPLAMA"></label> eklemelisiniz

bu label :: before elementine left:50% ve transform:translateX(-50%) eklemelisiniz

form ilk başta yanlış oluşturulmuş ta olabilir
wordpress-html-css-web işleri yapılır
  #5  
Okunmamış 22 Mayıs 2020, 23:37
ercorc Adlı Üyenin Avatarı
Grafik Tasarımcı
 
Üyelik Tarihi: 21 Mayıs 2018
Yaş / Cinsiyet: 33 / Erkek
Ad, Soyad: Er... Or...
Mesajlar: 187
Beğeniler: 42 / 95
Ticaret: 1, 100%
Alıntı:
mimarcan Adlı Üyeden Alıntı
Anladığım kadarıyla bir tek dışındaki çerçeve kalmış?
evet hocam bir kaç hizalama ve dış tablo çok fazla css den anlamıyorum. sadece basit düzenlemeler yapabiliyorum, bunu yapamadım.
https://gebeliko.com - Gebelik Sitesi
  #6  
Okunmamış 22 Mayıs 2020, 23:38
ercorc Adlı Üyenin Avatarı
Grafik Tasarımcı
 
Üyelik Tarihi: 21 Mayıs 2018
Yaş / Cinsiyet: 33 / Erkek
Ad, Soyad: Er... Or...
Mesajlar: 187
Beğeniler: 42 / 95
Ticaret: 1, 100%
Alıntı:
rws Adlı Üyeden Alıntı
bu şekilde yapamazsınız, önce formu class="field" li bir div içine alıp sonra

<label for="duedate" title="GEBELİK HESAPLAMA"></label> eklemelisiniz

bu label efore elementine left:50% ve transform:translateX(-50%) eklemelisiniz

form ilk başta yanlış oluşturulmuş ta olabilir
hocam doğrudur ama bende o kadar da kodlama bilgisi yok :/
https://gebeliko.com - Gebelik Sitesi
  #7  
Okunmamış 22 Mayıs 2020, 23:48
Avatar Seçilmemiş
rws rws şuan çevrimiçidir.
WM Aracı
 
Üyelik Tarihi: 23 Ekim 2012
Yaş / Cinsiyet: 33 / Erkek
Meslek: kimyager
Ad, Soyad: Er... Bu...
Mesajlar: 671
Beğeniler: 134 / 92
Ticaret: 2, 100%
Kod:
<div class="field redss">
  <label for="duedate" title="GEBELİK HESAPLAMA">tesrr</label>
  <form action="">
    içerikler
  </form>
</div>
formu bu şekilde oluşturabiliyor musunuz, yada form eklerken forma class atayabiliyor musunuz
wordpress-html-css-web işleri yapılır
  #8  
Okunmamış 22 Mayıs 2020, 23:52
ercorc Adlı Üyenin Avatarı
Grafik Tasarımcı
 
Üyelik Tarihi: 21 Mayıs 2018
Yaş / Cinsiyet: 33 / Erkek
Ad, Soyad: Er... Or...
Mesajlar: 187
Beğeniler: 42 / 95
Ticaret: 1, 100%
Alıntı:
rws Adlı Üyeden Alıntı
Kod:
<div class="field redss">
  <label for="duedate" title="GEBELİK HESAPLAMA">tesrr</label>
  <form action="">
    içerikler
  </form>
</div>
formu bu şekilde oluşturabiliyor musunuz, yada form eklerken forma class atayabiliyor musunuz
Hocam, bu tablonun css leri ek css olarak girildi, tablonun kodları da sayfanın içine gömüldü. eğer müsaitseniz özelden panale bilgilerini atsam bakabilir misiniz?
https://gebeliko.com - Gebelik Sitesi
  #9  
Okunmamış 22 Mayıs 2020, 23:58
Avatar Seçilmemiş
rws rws şuan çevrimiçidir.
WM Aracı
 
Üyelik Tarihi: 23 Ekim 2012
Yaş / Cinsiyet: 33 / Erkek
Meslek: kimyager
Ad, Soyad: Er... Bu...
Mesajlar: 671
Beğeniler: 134 / 92
Ticaret: 2, 100%
Alıntı:
ercorc Adlı Üyeden Alıntı
Hocam, bu tablonun css leri ek css olarak girildi, tablonun kodları da sayfanın içine gömüldü. eğer müsaitseniz özelden panale bilgilerini atsam bakabilir misiniz?
Kod:
form[name="dates"]{padding: 2rem 1rem; position: relative; border: 1px solid #333;}
  form[name="dates"]::before {
    content: "GEBELİK HESAPLAMA";
    display: block;
    top: 0;
    left: 50%;
    position: absolute;
    transform: translate(-50%, -50%);
    background: white;
    padding: 1rem;
}
ekleyip dener misiniz
wordpress-html-css-web işleri yapılır
  #10  
Okunmamış 23 Mayıs 2020, 00:06
ercorc Adlı Üyenin Avatarı
Grafik Tasarımcı
 
Üyelik Tarihi: 21 Mayıs 2018
Yaş / Cinsiyet: 33 / Erkek
Ad, Soyad: Er... Or...
Mesajlar: 187
Beğeniler: 42 / 95
Ticaret: 1, 100%
Alıntı:
rws Adlı Üyeden Alıntı
Kod:
form[name="dates"]{padding: 2rem 1rem; position: relative; border: 1px solid #333;}
  form[name="dates"]::before {
    content: "GEBELİK HESAPLAMA";
    display: block;
    top: 0;
    left: 50%;
    position: absolute;
    transform: translate(-50%, -50%);
    background: white;
    padding: 1rem;
}
ekleyip dener misiniz
ek css'e ekliyorum doğru mudur?
https://gebeliko.com - Gebelik Sitesi
Cevap Yaz Favorilerime Ekle

sosyal.market


Konuyu toplam 1 kişi okuyor. (0 üye ve 1 Ziyaretçi)
 
Seçenekler
Stil
Normal Normal

Geri Git   Forum > HTML - CSS - XML


Yetkileriniz
Konu açma yetkiniz: Yok
Cevap Yazma Yetkiniz Yok
Eklenti yükleme yetkiniz: Yok
Mesajınızı değiştirme yetkiniz: Yok

BB code: Açık
İfadeler: Açık
[IMG] Kodları: Açık
HTML kodu: Kapalı




Tüm Zamanlar GMT +3 Olarak Ayarlanmış. Şu anki Zaman: 06:56.